Des maquettes pour chaque appareil, ou juste une mondiale?
Je suis nouveau dans la conception de l'expérience utilisateur. Maintenant, j'ai commencé à travailler sur ma première idée d'application, c'est vraiment intéressant. Je veux faire cette application pour 3 plates-formes principales dès maintenant. S'il obtient des réponses positives, je suis également intéressé par le lancement de cette application en tant qu'application Web, et pour Blackberry également.
Je suis confus par une chose: est-il juste de suivre une seule conception et un seul flux pour ces trois plates-formes? Ou est-il préférable de faire toutes les différentes maquettes avec les normes de plate-forme de base, et je peux dépenser mon argent et mon temps selon les besoins de chaque plate-forme.
Est-ce que cela a du sens si je dépense de l'argent et du temps pour différentes conceptions, ou est-il préférable que j'utilise une seule conception de maquette pour toutes les plates-formes?
Vous êtes extrêmement susceptible de bénéficier d'une conception adaptative - une conception dédiée pour chaque groupe d'affichage. Twitter Bootstrap définit 3 d'entre eux (et vous pouvez voir la plage de largeur de chacun):
- Mobile
- Tablette
- PC de bureau
En ce qui concerne la conception du modèle, différentes tailles d'affichage affectent les éléments suivants:
- La quantité de contenu raisonnable à mettre dans un modèle.
- La visibilité des éléments de contenu/interaction (ce qui est vital pour une grande facilité d'utilisation).
- L'arrangement des articles.
- La taille des éléments.
- La façon dont les gens interagissent avec l'application (pas de clic droit, de vol stationnaire ou de comportement de glisser-déposer modifié sur les écrans tactiles; pouvez-vous imaginer un glisser -et-déposer entre deux tables sur un appareil mobile?).
- La hauteur ' fold ' - bien que beaucoup l'ignorent déjà pour les écrans de bureau, cela pourrait être un facteur si vous choisissez un modèle 'one-design-fits-all' 'approche.
- Il existe également la plate-forme standard (Microsoft et Apple a des différences dans leurs directives de conception).
Donc, à moins que votre application ne soit très simple (comme une seule page déroulante - lorsque la conception réactive peut fournir une solution universelle), vous devrez probablement créer des conceptions alternatives pour chaque groupe d'affichage.
Une petite conception d'affichage impliquerait généralement plus de modèles et une navigation plus approfondie, chaque modèle impliquant moins de contenu et d'éléments d'interaction. Vos modèles de tâches seront généralement découpés en modèles plus souvent avec de petits écrans. Ainsi, l'arrangement va changer. Vous devrez également tenir compte de la variation d'interaction entre les appareils.
Si des directives peuvent être données, vous pouvez commencer par la conception mobile - il est généralement plus facile de joindre des modèles pour des écrans plus grands que de les décomposer pour des plus petits. Les conceptions pour les petits appareils ont également tendance à promouvoir une plus grande proximité et un minimalisme (moins c'est plus), ce qui est généralement une bonne chose pour les conceptions.
Juste pour illustrer davantage, considérons les différences:
Si vos 3 plates-formes sont de tailles très différentes, vous devez entrer dans 3 maquettes différentes mais liées. Vous devriez google un peu sur "Responsive Design".
Je suppose que vous concevez l'interface pour les ordinateurs de bureau, les tablettes et les appareils mobiles.
Normalement, sur le bureau, vous avez beaucoup plus d'espace et vous pouvez le disposer comme vous le souhaitez (mais en suivant les directives UX courantes)
Au contraire, sur les appareils mobiles, vous rechercherez un design plus vertical car ils manquent normalement d'espace.
Un bon exemple est le site Web de Sony (je ne suis pas du tout lié à Sony xD) essayez de parcourir leur site à partir de votre bureau et de votre mobile.
Sur les appareils plus petits, certains éléments changeront la disposition et certains disparaîtront/s'effondreront même normalement dans la conception réactive, mais vous pouvez conserver la sensation générale/le style/la marque par rapport à la version de bureau/plus grande
Quoi qu'il en soit, si vous avez suffisamment de budget, je vous recommanderais vraiment de faire le site Web et différentes applications natives pour chaque plate-forme. Les gens aiment toujours plus les applications natives.
En tant que développeur moi-même, je trouve utile d'avoir des versions réactives des sites simulées ou au moins d'être données et d'indiquer comment les styles et les objets changeront lorsque l'écran deviendra plus petit.
Par exemple, à la taille du bureau, le rembourrage de base/les marges sur la plupart des éléments peuvent être confortablement autour de 20/30px, mais à quoi devons-nous nous abaisser aux tailles de tablette et de mobile? Passons-nous seulement à environ 10 pixels sur mobile ou baissons-nous également à la taille de la tablette?
Même sans une maquette complète de versions réactives d'un site, il est bon d'avoir une compréhension claire de la façon dont les éléments doivent être lorsque l'écran atteint certains points d'arrêt ou tailles.
Du point de vue de la conception, cependant, ce pourrait être une bonne idée d'expérimenter comment vos éléments fonctionneront avec des tailles d'écran plus petites. Je rencontre constamment des cas où un widget magnifiquement conçu pour un affichage de bureau ne s'intègre pas bien dans les cadres réactifs que nous utilisons.