Les entreprises qui suivent les tendances populaires en matière de design ne manquent pas pour attirer un marché de masse. Beaucoup plus rare est la race de société qui définit les tendances du design. Aujourd'hui, nous allons examiner les techniques d'une entreprise qui occupe le sommet de la chaîne de la conception alimentaire: Apple.
Vous trouverez ci-dessous 15 façons pratiques de suivre l'exemple d'Apple pour créer de superbes interfaces.
# 1: Restez simple
Jetez un coup d'œil à la page d'accueil d'Apple et ne pensez pas à ce que vous voyez, mais à ce que vous ne voyez pas. Je vais vous donner un indice, tout est sur ce site (non, pas même ce site, cliquez sur le lien idiot). La réponse est bien sûr l'encombrement visuel. Une page d'accueil est censée dire aux utilisateurs tout ce qui concerne votre entreprise, communiquer toutes les catégories de produits en détail, répertorier des fonctionnalités infinies et présenter votre logo aussi gros que possible. Droite? Selon Apple: faux.
La page d'accueil d'Apple montre simplement leurs travaux les plus récents et vous fournit quelques catégories faciles à comprendre pour vous aider à obtenir les informations que vous souhaitez voir. Certes, il est peu probable que vous conceviez pour une entreprise remarquablement omniprésente et qui ne nécessite aucune introduction. Cependant, vous pouvez toujours utiliser un design minimal mais attrayant pour augmenter la convivialité.
Imaginez que vous conduisez jusqu'à un aéroport. Pendant que vous conduisez, vous êtes simultanément frappé par cinq ou six panneaux contenant des cartes indiquant tous les emplacements, des terminaux aux toilettes accessibles aux personnes à mobilité réduite. L'argument avancé par le concepteur de carte est qu'il vous a fourni toutes les informations dont vous aviez besoin pour aller n'importe où. Vous auriez sûrement rétorqué que sa faute était de vous l'avoir tout à la fois alors que vous rouliez à 20 mi / h. Maintenant, imaginez que vous êtes à Sky Harbor, l'aéroport remarquablement facile à naviguer de Phoenix Arizona. Lorsque vous arrivez, vous voyez un panneau indiquant: Bonjour, bienvenue à Sky Harbor. Il y a trois terminaux? Ensuite, au fur et à mesure que vous avancez, vous rencontrerez plus de panneaux, chacun contenant une brève description des compagnies aériennes desservant chaque terminal et des destinations pour les arrivées et les départs. Le sentiment que vous obtenez lorsque vous conduisez dans Sky Harbor est "Wow, c'est facile!"
Apple adopte la même approche en matière de conception d'interface. Plutôt que de vous frapper avec tout ce qu'ils ont sous le nom de facilité d'utilisation, ils utilisent des informations plus petites pour vous mener à l'endroit où se trouve le contenu que vous recherchez vraiment. Examinez le site sur lequel vous travaillez et voyez comment vous pouvez diviser les informations complexes en éléments plus petits que l'utilisateur ne trouvera pas accablants.
# 2: Utilisez des produits étonnants
L'une des principales raisons invoquées par Apple pour réduire les graphiques superflus sur son site est de vraiment mettre en valeur l'essentiel: ses produits. Il suffit de regarder les coups qu'ils utilisent; Il est presque impossible de consulter une page du site Apple et de ne pas avoir les yeux rivés sur les produits pendant des secondes.
Plusieurs facteurs rendent ces produits si incroyables. La première est qu’elles sont évidemment immaculées. Craignez celui-ci aux experts en imagerie numérique. Je n'ai pas vu exactement comment ils le font, mais la combinaison est probablement un mélange de photographie, de modélisation 3D (à vous de choisir: Modo, Lightwave, Maya, etc.) et, bien sûr, de Photoshop.
La prochaine chose qu'ils font est de leur faire prendre une énorme partie de la page. Si vous passez des heures à faire une belle photo, puis que vous la réduisez à une vignette, ce n’est tout simplement pas aussi impressionnant. Notez également qu'Apple inclut fréquemment plusieurs produits disposés de manière attrayante, comme illustré ci-dessus.
La leçon à tirer ici est de ne pas simplement prendre une photo de votre produit et de l'appeler un jour. Passez du temps à le rendre fantastique. Que ce soit une boîte de haricots frits ou une Lexus, faites de votre mieux pour réussir un super coup de héros.
Vous ne croyez pas que vous pouvez rendre votre produit non technologique aussi beau que les produits Apple? Découvrez les boîtes de conserve We Shoot comme preuve qu'un artiste talentueux peut donner du tonus à n'importe quel produit.
# 3: Le contraste est la clé
Une autre chose qui rend ces photos de produits Apple si superbes est l’environnement simple dans lequel elles sont déposées. Le cerveau humain aime les contrastes. C'est la raison pour laquelle nous regardons les chaînes de montagnes et l'horizon au-dessus de l'océan. C'est aussi la raison pour laquelle nous disons? Oooooohhhh? quand on voit un iPhone noir brillant sur un fond blanc et plat. Vous devriez chercher à appliquer un contraste sélectif à chaque dessin que vous créez. Cherchez des occasions d’utiliser le contraste avec la couleur, la taille, l’épaisseur de la police et tout ce avec quoi vous devez travailler.
Apple ne fait pas qu'appliquer un contraste sur les photos de ses produits. Regardez la photo ci-dessus et réfléchissez à ce qui vous saute aux yeux. C'est probablement le gros bouton de téléchargement bleu. Naviguez sur le site d'Apple et vous verrez que presque chaque fois qu'ils veulent que vous fassiez quelque chose (achat, téléchargement, etc.), ils utilisent un bouton bleu clair pour attirer votre attention.
# 4: Suer les petites choses
Apple est axé sur le souci du détail. Chaque petit morceau de leur site est affiné à la perfection. Ne tombez jamais dans le piège de dire: personne ne le remarquera. ou? assez bon.? C'est souvent la marge de temps passée sur les moindres détails qui sépare les bons designers des grands.
Ne pas acheter dans l'argument des petites choses? Consultez les logos de médias sociaux sur la page d'accueil de Microsoft Office et dites-moi qu'ils ne vous font pas grincer des dents.
Je possède personnellement des fichiers vectoriels de chacun de ces logos. Maintenant, si je peux le faire, ne pensez-vous pas que les concepteurs de Microsoft auraient pu prendre le temps de rechercher de meilleures versions de ces logos pour éviter la sélection désordonnée de la baguette magique de Photoshop? Je vous mets au défi de trouver quelque chose d'aussi mal fait n'importe où sur le site d'Apple, et encore moins sur la page de destination de l'un de leurs logiciels les plus populaires.
# 5: Évitez le flash
Je n'ai jamais fait partie de la foule qui déteste Flash, mais le fait est que cette foule ne cesse de croître. Diriger les masses n'est autre que le PDG d'Apple et clairvoyant technologique de renommée mondiale, Steve Jobs. Découvrez cet extrait d'un article récent de Wired:
? À propos d’Adobe: Ils sont paresseux, dit Jobs. Ils ont tout ce potentiel pour faire des choses intéressantes mais ils refusent simplement de le faire. Ils ne font rien avec les approches adoptées par Apple, comme Carbon. Apple ne supporte pas Flash parce que c'est tellement buggy, dit-il. Chaque fois qu'un Mac se bloque le plus souvent, c'est à cause de Flash. Personne n'utilisera Flash, dit-il. Le monde se déplace vers HTML5. (La source)
Ce sont des paroles fortes d'un homme vénéré pour son leadership dans le monde de la technologie. Pour être honnête, une grande partie de ce qu'il dit sonne juste. Le contenu Flash en ligne n’est certainement pas la technologie la plus fiable, il dépend fortement de logiciels supplémentaires et de plugins à jour que l’utilisateur peut posséder ou non. En outre, HTML5 et CSS3 donnent un aperçu d'un avenir dans lequel vous pourrez réaliser une expérience multimédia hautement interactive avec un code simple et conforme aux normes.
En tant que développeur, si vous rejoignez Apple dans son boycott virtuel en Flash, vous ne le regretterez probablement pas. Vous n’avez même pas besoin de prendre une position active contre Flash, mais simplement d’éviter de l'utiliser autant que possible. Vous êtes pratiquement assuré d'avoir beaucoup moins de maux de tête d'utilisateurs qui ne peuvent pas voir votre contenu.
# 6: Rendez-le amical
Pendant des années, Apple a été considéré comme un culte tout sauf amical. Ils ont vraiment cherché à purger cette idée ces dernières années en restructurant leur image pour la rendre plus accessible. L’endroit le plus remarquable que vous voyez est celui-ci: Procurez-vous un Mac? les publicités. Le Mac est décrit comme un type de tous les jours tandis que le PC est le "là-bas". homme d'affaires qui est toujours à rien. De manière subliminale, ces publicités disent qu'Apple est vraiment une communauté ouverte et que tout le monde, des adolescents aux grand-mères, y trouvera sa place.
Une autre chose qu’ils ont faite est d’améliorer leur dossier d’assistance technique, qui était autrefois catastrophique. Désormais, toute personne résidant dans une grande ville peut simplement prendre rendez-vous auprès de l'Apple Store pour une consultation individuelle gratuite afin de résoudre les problèmes et / ou les questions que les clients pourraient avoir.
Toutes ces techniques sont renforcées par des graphismes de visages souriants et sympathiques. À l’heure actuelle, le magasin Apple situé près de chez moi compte une douzaine de découpages en carton d’employés d’Apple dans la fenêtre, comme pour dire: "Entrez, nous sommes heureux de vous aider." Vous pouvez également repérer ces employés souriants à quelques endroits sur le site Web Apple, comme le montre la photo ci-dessus.
Ce qu'Apple est en train de créer, c'est un équilibre entre un design basé sur une technologie étonnante mais non personnalisable et des visages souriants accessibles. Peu importe ce que vous vendez, demandez-vous s'il est approprié de le rendre plus convivial et réfléchissez à ce que vous pouvez faire pour y arriver. Même un simple? Bonjour? dans un titre peut aller un long chemin.
# 7: Utilisez une grille solide
L'image ci-dessus parle d'elle-même. Chaque page du site d’Apple adhère à une structure de grille stricte. que ce soit simple ou compliqué, c'est là. Le but? Découvrez combien d'informations ils vous jettent sur la page ci-dessus. Il se passe tout simplement une tonne de choses, mais cela semble attrayant au lieu d’être écrasant.
Briser les informations sporadiques en cellules gérables réduit considérablement le fouillis visuel et la confusion. Notez que chaque cellule contient également une référence visuelle pour accompagner la description textuelle. Ces références visuelles se ressemblent beaucoup et s'intègrent parfaitement dans le thème Apple. Même si vous utilisez des images de stock, essayez de conserver un thème similaire afin d'éviter toute disparité visuelle entre les images dispersées sur toute la page.
# 8: Créer des aides pédagogiques
Pour renforcer le message selon lequel le haut de la souris est en réalité une surface multi-touch, Apple a créé l'illustration ci-dessus. Même sans le titre, presque tout le monde serait capable de comprendre ce qui se passe dans la photo et par conséquent de savoir comment utiliser une toute nouvelle technologie avec laquelle ils ne connaissent absolument rien.
Apple va encore plus loin que les illustrations. Presque tous les composants matériels et logiciels présents sur leur site sont accompagnés d’une vidéo qui vous explique comment cela fonctionne. Cela contribue grandement à réduire les problèmes de support technique. Je renvoie souvent mes amis (qui se sont tous convertis à Mac à cause de moi et me voient donc comme un support technique gratuit) à ces vidéos car elles offrent une expérience beaucoup plus riche et plus facile à comprendre qu'une conversation téléphonique. Découvrez la bibliothèque de vidéos pédagogiques d’Apple pour voir à quel point elles sont formidables pour vous.
# 9: Soyez cohérent
La photo ci-dessus est une capture d'écran de l'iTunes Store. Semble familier? Si vous pensez que cela ressemble beaucoup à Apple.com, vous avez raison. Regardez maintenant autour de Mac OS X, en particulier dans le Finder. Encore une fois, nous voyons un design solide basé sur une grille, beaucoup de blanc, des textures métalliques et du bleu pour attirer l’attention (dans les sélections). Et enfin, jetez un coup d'œil à la gamme complète de matériel Apple pour voir ces textures et ces éléments de design entrer dans le monde réel.
Aspect général d'Apple ou? Essence de la marque? est appliqué à chaque chose qu'ils conçoivent. C'est assez étonnant quand on se rend compte à quel point leur logiciel ressemble en réalité à leur matériel. Combien plus intégré pouvez-vous obtenir? Si jamais vous êtes chargé de développer une marque, examinez tous les aspects de la société, des annonces télévisées et des sites Web aux produits. Réfléchissez à la manière dont vous pouvez intégrer tous ces éléments disparates pour ressembler à des pièces individuelles d’un tout cohérent.
# 10: Pas seulement un grand magasin
Apple est une excellente étude de cas dans un site de commerce électronique performant. Notez que l'ensemble du site est déterminé à vous inciter à acheter et à vous informer sur leurs produits.Cependant, le site ne ressemble pas à un grand magasin.
Ce que je veux dire par ceci est illustré dans les captures d'écran ci-dessus. La photo du haut est la page dédiée Time Capsule. Apple adore créer de belles pages de produits avec des titres astucieux vous informant de la qualité de leurs produits. Notez que ce n'est techniquement pas le? Magasin.? Si vous cliquez sur le bouton d'achat, vous accédez à la page du deuxième écran: le magasin en ligne actuel. Ici, Apple a complètement dépouillé l’attrait visuel et s’est concentré sur la convivialité. Ils vous fournissent les informations dont vous avez besoin sans vous laisser distraire et facilitent l'achat d'un article en quelques clics.
Si vous faites un magasin en ligne, votre première idée sera probablement de faire exactement cela: créer un magasin. Si vous avez le temps, le budget, la liberté, etc., envisagez de créer un site Web pour présenter les articles dans le magasin d'une manière qui ne serait tout simplement pas efficace dans le magasin lui-même. Créez de belles pages dédiées qui dynamisent vraiment votre produit et incluez un? Acheter maintenant? lien qui mène les clients à la section de magasin visuellement ennuyeuse mais très pratique du site.
# 11: Soyez confiant
Regardons les choses en face, les produits Apple sont assez étonnants. Cliquez sur le site d'Apple pendant quelques minutes et vous découvrirez qu'ils ne sont pas très humbles à ce sujet. Leurs titres sont remplis d'adjectifs comme beaux, puissants, amusants, révolutionnaires, faciles à utiliser et avancés. Leurs descriptions de produits vous informent que l'article est la meilleure chose disponible dans sa catégorie. Si vous l’analysez trop, cela peut sembler un peu hautain. Cependant, en tant que visiteur occasionnel, vous serez probablement simplement impressionné.
Que votre site Web annonce un produit, un service ou simplement une idée, ne vous vendez pas trop vite. Ne jamais utiliser le mot? Bien? quand vous pouvez dire "génial," ne jamais dire? attrayant? quand vous pouvez dire? beau.? Si vous avez confiance en votre produit, efforcez-vous de le communiquer à vos visiteurs. Vous constaterez que cela leur échappera et qu'ils auront généralement une première impression beaucoup plus positive si tout ce qui se trouve sur votre site vise à les convaincre de votre bien-être.
Comme n'importe quoi, il y a bien sûr un point de rupture. Demandez à quelqu'un qui n'est pas impliqué dans le site de relire votre copie pour vous assurer de ne pas faire l'éloge de soi si compliquée qu'elle devient une gêne.
# 12: Mettez la copie légale à sa place
Celui-ci est petit mais important. Si vous travaillez pour une entreprise suffisamment importante pour avoir un service juridique, vous savez que les employés des services juridiques travaillent très dur pour prouver qu'ils ne sont pas sans valeur. Cela signifie généralement qu'en tant que concepteur, vous créez quelque chose, envoyez-le au service juridique et récupérez un document de 500 mots contenant du contenu supplémentaire que vous devez inclure dans la loi. Inévitablement, la malédiction s'ensuit.
Ce que vous faites avec ce contenu est important. Déterminez s'il s'agit d'informations que l'utilisateur souhaite réellement connaître ou s'il s'agit simplement d'une nécessité diabolique que personne ne lira jamais. Si c'est le dernier cas, prenez une page du livre d'Apple (une bouchée de Apple pour ainsi dire) et jetez-la au bas de la page dans une police petite mais lisible qui ne contraste pas trop avec le fond. Votre objectif principal en tant qu'employé devrait être de rendre ce contenu accessible, trouvable et lisible. Cependant, votre objectif en tant que concepteur est de vous assurer qu'il ne gâche pas votre conception en la remplissant d'un encombrement sans importance.
N ° 13: Navigation complète sur le pied de page
Consultez le pied de page dans la capture d'écran ci-dessus. Apple a transformé le bas de chaque page en un outil de navigation extrêmement utile. C'est un excellent moyen de réduire la difficulté de naviguer dans un grand site. Plutôt que de remplir leur navigation principale avec un lien vers chaque section du site, ils l'ont réservée à des catégories générales. Dans une catégorie, si vous faites défiler l'écran jusqu'en bas de la page, vous trouverez une carte du site beaucoup plus complète dans le pied de page.
Remarquez qu'ils ne se sont pas efforcés de le faire ressortir. Il suffit que vous puissiez le repérer si vous recherchez quelque chose, mais suffisamment subtil pour ne pas y jeter un deuxième coup d'œil si vous n'avez pas besoin d'aide pour la navigation.
# 14: Créer de superbes icônes personnalisées
Avec l'introduction de OS X, Apple a introduit les icônes dans un tout autre domaine. Depuis lors, la superbe conception des icônes a inondé les systèmes d’exploitation et débordé sur le Web. Cependant, il existe quelques jeux d’icônes gratuits en ligne qui ont acquis une telle renommée qu’ils sont devenus clichés.
Avant de télécharger un ensemble d’icônes qui ressemble à tout le reste du Web, essayez-le vous-même. Lancez Photoshop et / ou Illustrator, éliminez vos compétences en dessin et créez-vous de superbes icônes personnalisées. À la fin, ils vont vraiment peaufiner la conception de votre site. En maîtrisant l'art du design d'icônes, vous remarquerez que vous dépendez beaucoup moins de l'art de tiers pour créer des sites exceptionnels (ce qui est une très bonne chose). Si tel est le cas, vous éviterez que les fous du service juridique ne tentent de déterminer les restrictions légales applicables à tous ceux qui sont gratuits. des icônes.
# 15: Contenu interactif et dynamique
Presque chaque page du site d’Apple contient un diaporama automatique, un menu accordéon animé, une vidéo ou une galerie de photos interactive. Le but ici est de garder l'attention de l'utilisateur. Le contenu statique peut être un peu ennuyeux et amener un utilisateur à quitter le site à la recherche de quelque chose de plus intéressant. Apple retient votre attention en vous offrant de nombreuses pages avec un contenu en constante évolution ou des éléments interactifs.
Ce type de contenu doit être abordé avec une extrême prudence pour un certain nombre de raisons. Tout d'abord, il est facile de laisser plus de la moitié de vos visiteurs derrière vous si vous programmez des fonctionnalités nécessitant un plugin spécial.Essayez de vous en tenir aux technologies largement prises en charge qui fonctionnent sur plusieurs navigateurs. En outre, il est très facile de se laisser emporter par le contenu dynamique. Il y a une frontière extrêmement fine entre accrocheur et ennuyeux et vous devez absolument savoir où cette ligne tombe. Sinon, vous donnez mal à la tête aux visiteurs au lieu de la bonne impression que vous recherchiez.
Une autre chose?
Pour résumer, Apple Inc. est à peu près synonyme de design élégant. En observant ces grands designers au travail, nous pouvons apprendre beaucoup de choses, qui vont bien au-delà de l’architecture. Les conseils ci-dessus sont destinés à être généralement appliqués à votre propre travail de manière unique. Utilisez-les comme inspiration pour vous frayer votre propre chemin dans la conception de sites de qualité.
Chaque fois que quelqu'un mentionne Apple, il est lié aux évangélistes et aux ennemis, désireux de partager leur amour éternel ou leur profonde haine des méthodes de conception d'Apple. Utilisez les commentaires ci-dessous pour nous dire laquelle vous êtes. Etes-vous tous pour le minimalisme mélangé avec des icônes brillantes ou êtes-vous marre de voir le Web ressembler à une bande de wannabes Apple? Nous voulons entendre vos pensées.