Artigos .NET Design de interfaces no Windows Phone
Artigo do tipo Exemplos Práticos
Recursos especiais neste artigo:
Conteúdo sobre boas práticas, Artigo no estilo Mentoring
Porque esse artigo é útil
Ao desenvolver aplicações para dispositivos móveis, deve-se planejar não só o que a aplicação vai oferecer, mas também como vai oferecer. Em um ambiente onde as dimensões da tela são bastante reduzidas se comparadas com um monitor convencional, é fundamental saber aproveitar os recursos que tem à disposição e construir interfaces gráficas eficientes, de fácil utilização e adequadas ao público e cenários a que se destina. Neste artigo serão apresentados conceitos fundamentais sobre o planejamento e implementação das aplicações para Windows Phone, focando na usabilidade e experiência do usuário, garantidas por uma interface gráfica bem desenvolvida. Em seguida serão apresentados os templates Panorama e Pivot, muito utilizados para organizar as páginas da aplicação.

O desenvolvimento de aplicações para dispositivos móveis é uma área que vem crescendo bastante nos últimos anos e ganhando a cada dia mais importância. E como em qualquer eixo do mercado, se há grande demanda, é natural que o número de pessoas e empresas se especializando e desenvolvendo suas aplicações também aumente. Ou seja, a concorrência cresce constantemente e cabe a cada um estar apto a enfrentá-la, oferecendo produtos de qualidade e, além disso, produtos diferenciados dentre os demais da mesma categoria.

De fato são diversos os fatores que devem ser considerados ao desenvolver uma aplicação, seja ela desktop, web ou mobile, mas um que tem ganhado muito destaque e vem mostrando muitas vezes um item decisivo é, sem dúvida, a interface gráfica. E quando falamos em interface gráfica, não podemos nos ater à aparência da aplicação (a cor da fonte, o formato dos botões, os efeitos de dégradé, etc.), é preciso pensar com muito cuidado e planejar bem a usabilidade do sistema. Não adianta encher a tela de cores, formas e efeitos se ela não for eficiente para o fim que se destina, e isso não se resume a fazer aquilo que propõe, a aplicação deve ser fácil de utilizar, adequada ao seu público e situações alvo.

Muitas vezes o usuário chega a instalar diversas aplicações concorrentes apenas para desinstalar em seguida, por não ter se adaptado à sua forma de funcionamento ou simplesmente por não ter gostado da aparência. E nessa comparação, após vários testes, acaba optando por utilizar uma que possui menos recursos, mas que lhe oferece uma interface elegante e de fácil utilização. Isso é algo que vem se tornando mais comum a cada dia, com a popularização de smartphones e outros dispositivos móveis e sua utilização por pessoas de todas as idades e nas mais diversas situações possíveis, é comum que os usuários passem a julgar as aplicações, pelo menos em um primeiro momento, como julgam outros itens do seu cotidiano, como vestuário, automóveis e decoração, ou seja, pela sua aparência. Só depois é que passa a analisar o conteúdo e funcionamento, o que na maioria dos casos é o mais importante.

Diante dessa percepção, ao desenvolver uma aplicação mobile é fundamental que seu visual chame atenção no primeiro momento e ao utilizá-la, que o usuário se acostume rapidamente. Para isso, é preciso planejar e implementar a interface gráfica das aplicações seguindo algumas dicas e boas práticas que se baseiam em estudos mais aprofundados sobre essas questões e podem auxiliar na garantia de uma boa experiência de usuário.

Boa parte pontos a serem observados sobre usabilidade é aplicável ao desenvolvimento mobile (podendo ser aplicada a web ou desktop) em geral, por outro lado, existem fatores que estão diretamente ligados ao visual e que por isso podem ser menos genéricos ou ainda aplicáveis a uma única plataforma/sistema operacional. Neste artigo trataremos questões relacionadas ao desenvolvimento de interfaces gráficas para aplicações Windows Phone, conhecendo os dois principais templates de interface padrão disponíveis no Visual Studio (Panorama e Pivot) e dicas fornecidas pela própria Microsoft e que devem ser levadas em consideração ao criar aplicações para esse sistema.

Princípios de design do Windows Phone

A Microsoft segue e sugere uma série de princípios a serem considerados ao projetar e desenvolver aplicações para Windows Phone que, se seguidos, contribuem para a criação de uma experiência de usuário satisfatória, garantindo assim o sucesso da aplicação. Esses princípios foram extraídos do conceito de design adotado pela Microsoft para esse sistema operacional, que preza pela leveza, fluidez e organização da interface, de forma que essa possa ser manipulada com praticidade em momentos em que dispõe de pouco tempo e onde requer agilidade. Um exemplo bastante usual disso é a necessidade comum de realizar ligações enquanto caminha ou no trânsito (apesar desse segundo exemplo tratar de algo geralmente incorreto).

Esses princípios foram divididos em cinco pontos principais que serão explicados a seguir, facilitando a compreensão e “absorção” dos conceitos no dia a dia do desenvolvedor:

Pride in craftsmanship

Este princípio diz respeito, de certa forma, à relação do designer com a interface que está criando e a forma como está fazendo isso. A palavra craftsman, segundo o dicionário da Merriam-Webster, significa “alguém que cria ou executa com destreza”, complementando com “principalmente nas artes manuais”. Em tradução livre para português, pode-se considerar craftsman como artesão, artífice ou ainda, artista. Ou seja, alguém que de certa forma mantém uma estreita relação como trabalho que executa, tratando com bastante atenção certos detalhes que são comumente observados pelos usuários finais.

Dentre esses detalhes está o alinhamento do conteúdo em um grid “imaginário”, que é fundamental para manter a simetria e proporção entre as formas e controles utilizados. Controles desalinhados entre si ou com vários alinhamentos distintos dentro de uma mesma página podem passar a sensação de desorganização para o usuário, principalmente no primeiro momento em que este tem contato com a aplicação. Portanto, devemos buscar sempre manter relações de proporção entre as dimensões dos elementos visuais. A ...

Quer ler esse conteúdo completo? Tenha acesso completo