O desenvolvimento de dispositivos móveis é a moda e a indústria interativa está em grande desordem quando inúmeros tablets e smartphones chegam ao mercado.

O desenvolvimento de aplicativos para dispositivos móveis recebe a maior parte da atenção, enquanto a Web para dispositivos móveis se arrasta discretamente. Mas a web móvel está progredindo todos os dias à medida que mais e mais desenvolvedores lançam interfaces otimizadas para dispositivos móveis.

A grande coisa sobre a web móvel é que ela é fundamentalmente construída com todas as mesmas ferramentas usadas no design e desenvolvimento web tradicional.

Isso torna muito mais acessível do que o desenvolvimento de aplicativos. Além disso, muitos usuários vão querer visitar o site de uma empresa em qualquer lugar, sem necessariamente precisar de um aplicativo completo.

A criação de sites otimizados para dispositivos móveis é tão semelhante, mas tão diferente do que é projetado para a área de trabalho. Certos fatores assumem um papel muito mais significativo. Por exemplo, variações de tamanho de tela, períodos de atenção do usuário e problemas de usabilidade são mais críticos do que nunca.

Esses mesmos problemas estão sempre presentes na área de trabalho, mas às vezes são mais fáceis de ignorar. Aqui, veremos algumas lições para aprender com a otimização que está acontecendo na Web para dispositivos móveis. As lições podem informar diretamente como projetamos e como pensamos sobre o design tradicional da web e a arquitetura do site.

Navegação simplificada em sites para dispositivos móveis

Uma das primeiras coisas que se torna evidente quando se está acessando sites móveis é a extrema simplificação da navegação. A navegação não só se torna muito proeminente e central em um site para dispositivos móveis, mas também é diminuída substancialmente para se concentrar apenas nos elementos mais críticos.

Eu acho incrível como a navegação de nível superior pode ser reduzida a dois ou quatro itens na maioria dos sites móveis. Naturalmente, reconheço que o conteúdo de um site para dispositivos móveis é muitas vezes otimizado para o público-alvo. Por exemplo, Verdade Tabernáculo da Igreja possui seis opções em sua navegação principal, sendo que apenas uma delas alcançou a navegação para o versão móvel ; e o que fez isso ("Contato") é o foco de toda a página inicial.

O conteúdo que não foi incluído na versão para celular, é claro, ainda é totalmente relevante. A interface móvel destina-se a capturar pessoas que tentam encontrar a igreja ou verificar os horários do serviço ou simplesmente contatá-los. Estes são os objetivos mais prováveis ​​do surfista móvel. Aqueles que acessam o site completo em um computador de mesa têm a mesma probabilidade de querer essas coisas, pois querem pesquisar a igreja para ver se é o tipo de lugar que gostariam de visitar.

Então, qual é a lição a aprender? Essas duas interfaces não visam audiências totalmente diferentes e têm objetivos totalmente diferentes? Talvez, mas podemos aprender muito com o foco extremo da interface móvel. Observe como tudo é sobre as ações que você pode tomar? A igreja eliminou todos os elementos de navegação que parecem caixas para marcar.

Um elemento interessante é a opção de navegação "Sobre" no site completo. O site para dispositivos móveis pode ser otimizado para pessoas em movimento, mas não há motivos para supor que eles não estejam interessados ​​em ler sobre a Igreja e suas crenças. Alguém pode ter mencionado a igreja para você de passagem, pedindo-lhe para procurar no seu telefone.

Portanto, a opção de navegação para este elemento deve ser alterada. E se, em vez disso, ele comunicasse algo como “o que você deve saber sobre nós”? Embora um pouco longo, reflete uma atitude mais útil. Um balde geral “Sobre” parece um lugar para guardar todas as informações que ninguém lê. "Um guia para visitantes de nossa igreja" parece muito mais útil e direcionado.

A simplicidade e o foco da interface móvel mostram que tudo deve ter o objetivo de ganhar um espaço no site. Se o mesmo acontecesse com o site completo, estaríamos menos inclinados a preenchê-lo com conteúdo aparentemente importante e mais inclinados a garantir que tudo tivesse uma função clara.

Isso reflete uma mentalidade muito orientada para a tarefa. Cada opção desafia o usuário a dar um passo ativo. É como se todas as opções passivas tivessem sido eliminadas e reduzidas a itens acionáveis ​​no site para dispositivos móveis. Isso nos leva à próxima lição: ser extremamente orientado a tarefas.

Sites para celular são orientados a tarefas

Com uma mentalidade orientada a tarefas, vamos reconsiderar o site completo. Enquanto a home page é lindamente projetada, a chamada à ação é bem menos evidente. O conteúdo está repleto de informações esperando que você decida se interessar.

Por exemplo, a faixa grande que destaca um evento que vem não me chama a algum tipo de ação; muito passivo. Com uma mentalidade orientada para a tarefa, poderíamos melhorar muito o apelo à ação “Leia mais”. Isso pode ser tão simples quanto tornar a chamada à ação muito mais proeminente; por exemplo, um botão grande em uma laranja contrastante. Além disso, a chamada pode ser alterada para "Saiba mais e inscreva-se".

Outro exemplo é a mensagem de boas vindas. Eu aprecio a intenção e a mensagem sendo comunicada aqui. A mensagem mostra que pessoas reais estão por trás do site e tenta fazer com que a página pareça pessoal. Mas, novamente, vamos dissecar isso com uma mentalidade orientada para a tarefa. Um ótimo acompanhamento para uma apresentação como essa seria um claro apelo à ação incentivando os visitantes a dar o próximo passo. Afinal, as únicas pessoas que estarão lendo isso são recém-chegados. Os membros atuais irão ignorar isso para coisas como o calendário de eventos. Por isso, ofereça um ponto de conversão para os usuários, como "Faça uma pergunta difícil" ou "O que esperar quando você visitar".

Em contraste, a caixa “Convidado especial” é fantástica. Ele aborda os principais problemas e leva as pessoas a se aprofundarem. Eu só me pergunto se poderia ser um elemento mais proeminente da página. Mais uma vez, os membros chegarão aonde precisam ir; Assim, concentrar-se naqueles que são novos no site e na igreja seria um grande passo para maximizar a oportunidade.

Eu sei que estou realmente batendo este site, mas não é porque eu não gosto dele ou acho que ele não serve a sua função. Meu objetivo é apenas desafiar nosso pensamento e nossas noções preconcebidas de como um site deve ser e fazer. Eu realmente recomendo esta igreja por ter um site bonito e funcional, com uma extensão móvel para arrancar!

Sites para celular diminuem drasticamente seu conteúdo

Outra lição óbvia relacionada à redução da navegação é que os sites para celular invariavelmente reduzem seu conteúdo. Não apenas o número de opções é reduzido à funcionalidade principal e ao objetivo do site, mas a cópia também é muito reduzida.

Em alguns casos, grande parte da cópia é totalmente eliminada! Isso levanta a questão, este conteúdo é necessário no site completo se a versão móvel funciona bem sem ela? Divi Aruba é um ótimo exemplo disso. O discurso de marketing sedutor colocado sobre a foto pode parecer um elemento obrigatório para a home page, mas foi nuked no micro site para celular .

Na versão móvel, o logotipo é colocado sobre a mesma imagem, e ainda transmite a mesma mensagem: se você quiser ir a algum lugar como este, continue lendo. Por que não usar esse local proeminente para levar as pessoas à ação desejada? Certamente os designers sabem qual é o elemento mais crítico para converter visitantes em clientes. Coloque essas informações em funcionamento e atraia pessoas para lá com uma frase de chamariz proeminente em vez de falar com marketing fofo.

Todas as coisas boas, sans fluff

Isso nos leva à próxima lição: perder o fluff. O próximo exemplo é uma demonstração positiva disso. Travel Tex é um site de informações sobre viagens para o estado do Texas. Tem um propósito claro e público em mente. Felizmente, os designers abraçaram totalmente a mentalidade de menos fofo.

Não só o mini site para celular focar inteiramente no tópico em questão e nos principais itens acionáveis, mas também o site completo! Que alívio não ver quase nenhuma penugem. Incluir algo sombrio como uma história do Texas seria muito tentador. Se as pessoas quisessem uma aula de história, elas não viriam neste site. Você será duramente pressionado para encontrar conteúdo que não é relevante para o propósito singular deste site.

Adquira o hábito de questionar tudo. Essa é a única maneira de realmente reduzir um site a seus elementos críticos, o que é exatamente o que acontece em um bom website para dispositivos móveis. Escolhas difíceis são feitas e de outra forma o conteúdo valioso é cortado para agilizar o site. Chame o fluff para o que é e nuke ele!

A marca é o rei na web para dispositivos móveis

Eu sou toda sobre criatividade na web. De fato, muitas das maiores mudanças na indústria ocorreram como resultado de uma recusa em manter o status quo. Mas há um tempo e lugar para tudo. Muitos designers usam suas atribuições como uma desculpa para liberar sua criatividade, para nenhum outro propósito além de fazer algo criativo. Isso transforma o site em um design para o designer, não para o cliente e suas necessidades. Isso é uma coisa contra a qual a Web móvel avisa com ousadia.

O branding é incrivelmente consistente na Web para dispositivos móveis, e uma das partes mais consistentes é o posicionamento do logotipo. Em websites para dispositivos móveis, você não encontrará logotipos malucos na parte inferior com rodapés fixos. Funcionalidade é rei, e os logos sempre aparecem no topo. Você pode imaginar acessar um site para celular e não ver o logotipo imediatamente? No entanto, isso é comum em muitos sites completos.

Aqui estão alguns sites que, embora mínimos e sem estilo, são ricos em branding que não podem ser perdidos.

A lição aqui pode ter um profundo impacto em como você aborda seu trabalho e no valor fundamental que você representa para seus clientes. Para cada designer que descobre que as necessidades do cliente devem ser o propósito de todo o projeto, há outro que quer mostrar ao mundo como são criativas e originais.

Como qualquer outra pessoa envolvida na produção de um website, o web designer deve ter a mentalidade única de servir o cliente, ajudando seus negócios e melhorando o resultado final. Com cada elemento que você coloca em um site para celular, considera seu papel e o benefício que ele trará. Aplique essa mentalidade em tudo que você faz e logo encontrará um forte aliado em seu cliente.

Quanto mais aceitarmos as necessidades do cliente e fizermos tudo o que pudermos para agregar valor ao site, mais veremos uma mudança fundamental em nosso trabalho. Iremos desde a construção de “coisas legais” até a observação de tudo, desde a perspectiva do cliente. Esse recurso pode aumentar seu lucro? Como o design pode ser alterado para melhorar seus negócios? Se um subproduto do seu trabalho é mais dinheiro para o cliente, você encontrará oportunidades em todos os lugares.

Websites sem os truques

Uma das maiores conquistas da web móvel é a total falta de truques. Para ser justo, há um tempo e lugar para truques na web. De fato, dedico seções inteiras de meus livros a eles. Mas a falta de truques em sites para celular demonstra que essas ideias aparentemente excelentes não servem a nenhum propósito real.

Tudo o que acontece em um website para dispositivos móveis deve passar por vários filtros. O conteúdo é relevante e totalmente útil? O conteúdo é crítico e ele serve ao propósito central do site? O site é fácil de usar e entender? A navegação é não convencional? Em caso afirmativo, é essencial para o funcionamento do site? A resposta pode ser sim, mas, mais frequentemente, será um não decisivo.

Alguns truques notavelmente ausentes do desenvolvimento para dispositivos móveis são telas iniciais, navegação incomum, animações sem sentido e interatividade, regiões de rolagem inline, layouts estranhos e layouts de largura fixa. A eficiência da web para celular é incrível.

Conclusão

Como você pode ver, temos várias lições para aprender na Web para dispositivos móveis. particularmente, sua capacidade de revelar elementos desnecessários de um site. Tal como acontece com muitas coisas na vida, uma ligeira mudança de perspectiva, muitas vezes abre os olhos para o verdadeiro valor das coisas que há muito tempo tomamos como certo.

Não estou sugerindo que perdemos de vista o propósito da web. Pelo contrário, estou propondo que adotemos uma mentalidade muito mais estratégica.


Patrick McNeil é escritor freelancer, desenvolvedor e designer. Em particular, ele gosta de escrever sobre web design, treinar pessoas no desenvolvimento web e construir websites. Mais recente projeto de livro de Patrick é O manual da Web do designer ; Ele inclui muitos tópicos ao longo das linhas deste artigo. Você pode descobrir mais sobre isso TheWebDesignersIdeaBook.com . Siga Patrick no Twitter @designmeltdown .

Este post foi trazido a você por DudaMobile, um site para celular empresa de criação.

Quais aspectos do design para dispositivos móveis você tenta traduzir para a área de trabalho? Você vê simplicidade e rapidez na web para dispositivos móveis?