NPDD/Baobáxia/Interfaces
(→Estudo para composição do wireframe / layout) |
(→Estudo para composição do wireframe / layout) |
||
Linha 14: | Linha 14: | ||
-> esqueci a senha | -> esqueci a senha | ||
− | + | === BUSCA / CONTEÚDO === | |
- [PAG] interface de busca | - [PAG] interface de busca | ||
Linha 44: | Linha 44: | ||
- [PAG] página de upload de conteúdo | - [PAG] página de upload de conteúdo | ||
− | + | === USUÁRIO === | |
- perfil | - perfil | ||
− | + | === MUCUA === | |
- [PAG] tela home da mucua | - [PAG] tela home da mucua | ||
Linha 83: | Linha 83: | ||
- [NAV] modo de destaque entre abas atual e rede | - [NAV] modo de destaque entre abas atual e rede | ||
− | + | === FUNCIONALIDADES === | |
− | + | ||
- [FUNC] interface personalizável | - [FUNC] interface personalizável | ||
-> interface diferente por mucua ou por tag | -> interface diferente por mucua ou por tag |
Edição das 20h08min de 21 de maio de 2014
Conteúdo |
Interfaces para o Baobáxia
Considerando que o Baobáxia compõe-se de distintos níveis estruturais de aplicação, do mais estrutural ao mais aparente, temos:
- Base: estrutura de arquivos nos servidores locais, servidor de sincronização (git annex + sistema de arquivos), (arquivos propriamente ditos e metadados)
- Intermediário: aplicativo de servidor para gerenciar o upload, organização e preenchimento de metadados, requisição de conteúdos de outros repositórios etc (django + [banco de dados]; possivelmente outros sistemas, no futuro)
- Superior/interface: visualização/ções construídas em cima da aplicação intermediária, destinadas a prover a visualização (html, jquery etc)
Estudo para composição do wireframe / layout
Caminhos de navegação
- [PAG] login -> esqueci a senha
BUSCA / CONTEÚDO
- [PAG] interface de busca -> busca por termos, tipo de arquivo, mucua -> termo + termo + termo -> limpar termo (quando vc passa o mouse em cima, mostra botao de [x] fechar) -> grid / lista -> diferentes exibicoes -> grid: imagens em quadrados -> lista (texto|miniatura): lista com colunas ordenáveis -> permite solicitação de conteúdo -> padrão: lista com miniatura
- [PAG] página do conteúdo -> local ou rede -> exibição dos metadados (local|rede) -> exibição do conteúdo (local) -> exibição de preview/thumb (local|rede) -> caixa de solicitação (rede) -> marcador caso conteúdo já tenha sido solicitado -> conteúdos relacionados (rede) -> listar quem tem o arquivo / rastro -> bloco lateral com informações sobre a mucua em uso -> avatar/foto da mucua -> nome da mucua -> + info -> sempre que entra num conteudo em mucua externa, exibir barra de status da mucua local
- [PAG] página de edição de conteúdo - [PAG] página de upload de conteúdo
USUÁRIO
- perfil
MUCUA
- [PAG] tela home da mucua -> conteúdo recente local -> conteúdo recente rede (última sincronizacao) -> conteúdos destacados -> data da última sincronizacao -> informações sobre a mucua -> nuvem de tags da mucua -> busca -> navegação
- [PAG] histórico de syncs - [PAG] informações sobre sync específico (hash) - [PAG] informações sobre sync pendente - [PAG] informações sobre a mucua -> tags da mucua -> espaço utilizado - atual / previsto / total -> conteúdo requisitado / aguardando sincronização -> estatística - por tipo de conteúdo etc -> navegação -> [se não for mucuaLocal] definir como mucua vizinha [FUNC] -> informacoes sobre a mucua, telefone, endereco etc
- [PAG] listagem das mucuas -> listar nomes das mucuas -> mucuas relacionadas / mucuas vizinhas (definidas pelos usuários)
- [NAV] - Navegação entre páginas. exemplos: -> busca -> conteúdo -> voltar para resultados da busca
- [NAV] modo de destaque entre abas atual e rede
FUNCIONALIDADES
- [FUNC] interface personalizável -> interface diferente por mucua ou por tag -> substituir o template por nome da página. -> tipo: formato etc -> tag: [tags] Ex: - page-tipo-jpg.tpl
- page-home.tpl - page-tag-radio.tpl
- [FUNC] Interface personalizável: gravar filtros como abas -> abas AND (+) e OR (|) -> VIDEO | IMAGEM | ÁUDIO -> VÍDEO + DOCUMENTÁRIO -> RÁDIO | VINHETA | MÚSICA
- [FUNC] tags funcionais para layout - [FUNC] conteúdos relacionados: caixa que puxa conteúdo relacionado ao conteúdo atual
Wireframe
Proposta inicial de interface de visualização
Um protótipo de visualização, baseada exclusivamente nas tags, prevê que estas sejam usadas para filtrar cada tipo de conteúdo, cumulativamente. A visualização poderia ser definida de acordo com os usos / tags de cada servidor local, e permitiria na mesma ferramenta o acesso aos conteúdos remotos, que poderiam por esta mesma ser solicitados. Para que o sistema mantenha-se dentro das suas capacidades de armazenamento, a indicação do espaço em disco utilizado e previsão de uso será apresentada diretamente na interface de visualização do conteúdo externo.
São apenas rascunhos de interfaces, pensadas para serem criadas como filtragens a partir da tag (presente no metadado), tanto de forma fixa (como visualização padrão) como por busca. (são apenas para fins ilustrativos das funcionalidades)
Na primeira, há apenas a distinção de ambientes (local ou rede). Como está no local, exibe todo o conteúdo, sem mais filtragens. Note que é possível adicionar filtragens no campo +:
No caso abaixo, há uma listagem filtrada pela tag 'história', cujos resultados estão organizados por tipos (igualmente tags) para ser exibidos em determinado contexto local, como 'vídeos', 'música', 'programas de rádio'. Novamente, é possível adicionar filtragens.
Note que não necessariamente os conteúdos tem que ser filtrados por essas etiquetas; é possível adicionar etiqueta do assunto e na sub-janela do tipo de conteúdo.
Abaixo, trata-se duma tela de consulta dos arquivos da rede como um todo. Para uma busca, são exibidos os resultados bem como a localização das cópias. Note que é possível também adicionar a filtragem dos resultados de acordo com os servidores da rede (ex: vou viajar para Casa Tainã, logo filtrar somente pelos arquivos da Casa Tainã)
Interface textual/terminal
Baobáxia
* Usuário: * Senha:
> Publicar um conteúdo > Alterar/remover um conteúdo > Sincronizar pela internet > Sincronizar por media > Configuração
Publicar um conteúdo
* Escolher arquivo (caminho/path) * Etiquetas [local, publico, urgente (max. 30 MB)] * Comentário de publicação
(linha curl para publicar um conteúdo) # $ curl -F "name=teste123" -F "tags=entrevista" -F "note=" -F "license=" -F "date=2013/06/07" -F "type=imagem" -F "mediafile=@img_0001.jpg" -X POST http://localhost:8000/redemocambos/dandara/media/ > /tmp/x.html
Alterar/remover um conteúdo
* Escolher arquivo (caminho/path) * Etiquetas [local, publico, urgente (max. 30 MB)] * Comentário de publicação * Remover localmente [ ] * Marcar para remover definitivamente [ ]
Sincronizar pela internet
* Iniciar a sincronização pelo: padrão ou [lista dos remotes] * Status da sincronização
Sincronizar por media
* Iniciar a sincronização pelo: padrão ou [lista dos remotes] * Status da sincronização
Configuração
* Nome da Mucua: * Inicializar o Baobáxia
Proposta da Silia Moan
Baobáxia: Confluências entre Redes Quilombolas e Software Livre
Monografia desenvolvida no Istituto Europeo di Design (IED): Arquivo:Monografia SILIA 11 dezembro.pdf
Algumas telas da proposta de interface: