Projetando aplicativos para a web aberta

Ao criar Open Web Apps, você precisa dar muita atenção à aparência, experiência do usuário e fluxo de trabalho de suas aplicações. Nas partes anteriores deste material vimos o planejamento e aplicação de layouts flexíveis para aplicações, e nesta seção iremos mais longe, vendo os padrões gerais e técnicas de design para trabalhar com Open Web Apps, e as técnicas específicas e recursos que irão ajudá-lo a montar aplicativos para o Firefox OS com uma aparência que corresponde a experiência de aplicativos padrão do dispositivo.


Nota: os artigos desta seção tem uma grande quantidade de detalhes, incluindo links para exemplos e ativos relevantes. Se você está apenas à procura de uma biblioteca de ativos e amostras, BuildingFirefoxOS é um bom lugar para ir.

High level app design concepts

Design principles
A useful list of general design principles to start with.
Installed app considerations
High level considerations particular to installed Open Web App UX.
Graphics for responsive sites
Ideas to keep in mind when designing graphics for responsive sites and applications.
Grid design approaches   

Design guides and resources

Design patterns
Guides to effective design patterns that work on small screen apps, including Firefox OS.
Building blocks
A library of components for use in Open Web Apps, including usage guides, assets, and HTML, CSS and JavaScript code snippets.
Design asset library
Graphical assets for helping design the visuals of Open Web Apps, including PSD files.
Content style guide
A guide to choosing effective fonts, writing good copy, and creating good image content for Open Web Apps.
Colors
Color palettes for Firefox OS apps, and general color scheme advice for Open Web Apps
Firefox OS Icon style guide
Designing a good application icon, and icon usage best practices.
 
Tools for app developers
Technology reference documentation
Getting help from the community

If you still aren't sure how to do what you're trying to get done, feel free to join the conversation!

Don't forget about the netiquette...

 

Etiquetas do documento e colaboradores

 Colaboradores desta página: rodrigopadula, Agneli, teoli
 Última atualização por: rodrigopadula,