Share
Dans cet article, nous allons examiner une analogie simple qui illustrera des moyens efficaces de communiquer par le biais de la conception. Une fois l’idée établie, nous examinerons quelques exemples familiers pour faire comprendre le problème..
L'analogie que nous allons examiner est la transformation de Fourier, un outil mathématique intrigant nommé d'après le Français Joseph Fourier..
Pour commencer, il pourrait ne pas vous impressionner par ses équations complexes (et apparemment ennuyeuses). Mais, cachée au fond de ces équations, il existe une idée simple: toute onde, ou tout signal basé sur le temps, peut être décomposé en de nombreuses autres ondes, qui constituent l'original. En d'autres termes, il indique les ingrédients individuels qui entrent dans la fabrication du produit final.
La transformée de Fourier a des applications allant de la résonance magnétique nucléaire (RMN) à la compression MP3, mais nous allons l'appliquer à quelque chose de plus familier: la conception.
Par exemple, vous avez décidé de créer un site Web lorsque vous avez un concept qui doit être communiqué aux utilisateurs. En tant que concepteur Web, votre travail consiste à créer une page Web qui décompose cette idée en éléments gérables. des morceaux d'images, des morceaux de texte ou même des vidéos qui, lorsqu'elles sont consommées par un visiteur, traduisent l'idée dans son esprit.
Pensez au carré rouge dans l'image ci-dessus comme étant l'idée ou le message que vous souhaitez transmettre via votre site Web. Chaque vague bleue, bien qu’elle ait l'air totalement différente prise individuellement, contribue à créer la vague rouge d'une certaine manière lorsqu'elle est combinée avec les autres vagues bleues. Votre travail consiste à comprendre les "vagues bleues" (les éléments composites) de votre message principal. Hélas, si seulement nous avions une formule pour cela!
En fin de compte, si le visiteur comprend parfaitement l’objet de votre site Web et qu’il est confiant de l’utiliser, votre rôle de concepteur sera réussi..
Le dernier iOS 7 d'Apple, bien que reçu avec une réponse mitigée sur les nouvelles couleurs, l'esthétique, l'iconographie et la typographie, est un pas en avant positif. En tant qu'utilisateur d'iPhone, je trouve que la dernière offre logicielle d'Apple est une expérience beaucoup plus utilisable et agréable que son prédécesseur. Je ne peux pas imaginer revenir à iOS 6 maintenant que je me suis habitué à la nouvelle interface. Ceci est attribué à plus que de simples effets de parallaxe, animations et autres friandises pour les yeux. L'une des principales raisons qui rendent iOS 7 si utilisable est qu'elle englobe le contenu plutôt que de l'envelopper dans un skin skeuomorphic. Apple appelle cette approche "déférence".
Déférence - L'interface utilisateur aide les utilisateurs à comprendre le contenu et à interagir avec ce contenu, sans jamais le concurrencer - Règles d'interface utilisateur iOS
Dans la première page du guide de conception, une capture d'écran côte à côte de l'application Weather native sous iOS 6 et iOS 7 parle d'elle-même. la conception embrasse le contenu. Vous n'avez pas à lire un mot pour être informé instantanément de la météo. Chaque détail devrait aider à exprimer le message.
Lors de la conception de votre site Web parfait, veillez à bien réfléchir à chaque détail. Chaque composant qui le compose; la typographie, la couleur, les images, chaque détail, y compris le favicon, devraient contribuer de manière constructive, en travaillant ensemble en parfaite harmonie pour transmettre efficacement votre message.
Je me suis souvent demandé pourquoi certains sites Web placent bien en évidence un bouton "commentaires" directement sur la page d'accueil. Bien qu’il soit absolument nécessaire d’obtenir des informations sur votre travail, ne donnez jamais l’impression que vous n’êtes pas sûr et que vous n’êtes pas confiant. Pensez-y de cette façon: lorsque vous faites vos courses, on vous a déjà posé la question "Que pensez-vous de l'éclairage et de la peinture de notre magasin?" droit quand vous entrez dans un magasin? Ces détails sont essentiellement invisibles pour nous. Nous ne traitons pas consciemment le bon éclairage et l'ambiance générale du magasin..
En disant cela, votre cerveau reçoit continuellement des informations de vos yeux et d'autres organes sensoriels sur l'environnement qui vous entoure. Une bonne ambiance de magasin changerait définitivement votre idée de ne pas acheter un produit chez eux. Pour revenir au sujet, les liens de commentaires devraient être accessibles, mais cachés. Gmail fait du bon travail dans ce domaine:
Posez-vous deux questions lorsque vous ajoutez quelque chose à votre site Web:
La perfection est atteinte, non pas lorsqu'il n'y a plus rien à ajouter, mais lorsqu'il ne reste plus rien à enlever
Google a toujours été un maître du minimalisme dans le design. Une récente mise à jour a supprimé la barre supérieure sombre de leur page d'accueil, car les internautes consultent Google.com au lieu de se laisser distraire par les autres produits proposés par Google. Cette barre supplémentaire n'a jamais contribué au message principal de leur moteur de recherche: recherchez sur le Web. Au lieu de cela, ces liens sont maintenant soigneusement placés dans une liste déroulante, de sorte que les utilisateurs intéressés puissent y jeter un coup d'œil et naviguer lorsque cela est nécessaire.
GoodUI.org est une excellente compilation de 32 idées de Jakub Linowski qui vous aideront à construire une bonne interface utilisateur utilisable. La première astuce consiste à essayer une disposition à une colonne plutôt qu'une disposition à plusieurs colonnes. La justification de cet argument est que, ce faisant, vous devriez pouvoir guider vos lecteurs de manière plus prévisible de haut en bas, alors qu'une approche multicolonne présente un risque supplémentaire de nuire à l'objectif principal d'une page..
Les mises en page multicolonnes sont utilisées dans l’impression depuis des siècles et elles fonctionnent bien. Prenons le cas du New York Times ou de Mashable. Le contenu est une collection d'articles (ou de nouvelles), chacun ayant un en-tête important. Ils n'ont pas un seul message de base pour leurs visiteurs, mais plutôt une collection d'informations à leur intention, et leurs interfaces le fournissent efficacement..
Une disposition en une colonne guidera vos lecteurs de manière prévisible, sans risque de les détourner de l'objectif principal d'une page.
Jetez un coup d’œil à ce diagramme simple, que j’utilise pour représenter «expression»:
Le cercle intérieur représente ce que vous exprimez aux autres et le cercle extérieur est le message que vous l'intention exprimer. Cela ne s'applique pas seulement à la conception Web, en fait, ce concept vous aidera à améliorer vos compétences en communication en général. Chaque fois que vous essayez d'exprimer ou de communiquer une idée à d'autres personnes, faites de votre mieux pour élargir le cercle intérieur. Evaluez-vous et essayez de vous mettre à la place de votre public. Quelle quantité de votre message prévu exprimez-vous réellement?
Portfolio of Calm Digital illustre bien la possibilité d'exprimer efficacement une idée de base. Dans ce cas, la première chose que vous remarquerez est le mot "Calm" écrit en énormes lettres Sans-Serif sur un fond bleu. Le contraste entre le blanc et le bleu utilisé est parfait; pas trop et pas trop peu, juste assez calme. La couleur bleue est bien connue pour favoriser les sentiments de calme et de sérénité.
Ne craignez aucune occasion qui pourrait vous aider à mieux exprimer les choses. Les connexions Internet sont plus rapides qu'auparavant, les navigateurs sont beaucoup plus puissants et performants et les technologies riches comme HTML5, CSS3, etc. donnent plus de pouvoir que jamais aux développeurs Web. L'époque où vous étiez limité à la création de pages statiques est révolue. N'hésitez pas à utiliser les derniers outils et technologies si cela peut vous aider à mieux faire passer votre message à vos visiteurs. J'insiste sur la dernière partie de cette phrase: si cela peut vous aider à mieux faire passer votre message à vos visiteurs.
Il y a quelques années à peine, nous ne pouvions pas imaginer placer une vidéo complète comme fond d'écran d'un site Web. Mais voilà, ce n’est pas rare de nos jours. Il n'y a pas de meilleur moyen de transmettre l'expérience de l'utilisation d'une tablette qu'une vidéo. C’est exactement ce que Google a fait pour son site Web Nexus 7. En cliquant sur un bouton, vous êtes au beau milieu de l'expérience Nexus.
Spotify va encore plus loin et lit automatiquement une vidéo en arrière-plan. C'est captivant…
Le site web du designer Fernando Maclen utilise une vidéo floue en arrière-plan qui le montre au travail. La page entière reste fidèle à la légende "Superb simplicité".
Passons brièvement en revue ce que nous avons couvert dans cet article:
J'espère que vous avez apprécié cet article, merci d'avoir lu!
Accentsconagua