Exploration des styles d'interface utilisateur graphique - du minimum au futuriste

Une interface utilisateur (UI) peut prendre de nombreux styles allant du très simple au extrêmement complexe. Dans cet article, nous allons explorer une gamme de styles démontrant qu'il n'existe pas une seule recette pour créer une interface utilisateur esthétique et réussie. Bien entendu, tous les styles ne sont pas représentés dans cet article; Nous allons explorer plusieurs exemples de grande qualité représentant un large éventail de styles graphiques allant du simple au complexe. Prendre plaisir!

Ce post est le jour 9 de notre session de conception d'interface. Sessions créatives "Session 8

Section 1: Minimal

Une interface utilisateur de style minimal s'appuie fortement sur le type, les symboles et les espaces pour créer une expérience utilisateur simple et claire. On trouve souvent dans ces interfaces de larges couleurs unies ou une absence totale de couleur. Les graphiques étant utilisés avec parcimonie, la disposition des éléments est extrêmement importante. Lorsque cela est fait correctement, cela crée une interface claire et directe.

HelvetiNote ™



HelvetiNote ™ de cypher13 utilise un excellent mélange de poids et de tailles de police, ainsi que d'icônes judicieusement placées et d'éléments d'interface pour former une interface utilisateur extrêmement minimale. Cette interface utilisateur prouve que vous n'avez pas besoin de graphiques très détaillés pour vous démarquer du reste de la foule..

HTC 1 Concept



Lorsque le concepteur Andrew Kim a décidé de concevoir un nouveau matériel, il a envisagé une solution complète associant le matériel et l'interface utilisateur. Ce faisant, il a créé une expérience simple et minimale. Si vous n'avez pas encore vu son article à ce sujet, c'est un must.

Des choses



Les gars de Cultured Code ont créé une interface utilisateur très simple et élégante pour Things, un gestionnaire de liste de tâches. Disponibles à la fois pour Mac et iOS, leur conception comporte un jeu de couleurs en sourdine, des icônes nettes et un Mac sentir l'interface utilisateur.


Section 2: Graphique détaillé

Les interfaces graphiques détaillées font largement appel aux graphiques pour créer une expérience utilisateur. Vous y trouverez notamment des textures, des couleurs vives, des dégradés, des rehauts, des reflets et des ombres. Bien qu'elles aient un peu plus d'interface qu'une interface minimale, ces interfaces utilisateur sont toujours faciles à digérer et sont généralement faciles à utiliser..

Factures



Bills utilise des couleurs vives avec un menu inférieur de type Apple et des accents de bois pour créer une expérience utilisateur de traitement des factures unique et intrinsèquement familière aux utilisateurs d’iPhone. Avec ses graphismes nets et son aspect convivial, Bills a toutes les qualités du succès.

Beats



L'utilisation d'une palette de couleurs non standard est l'un des nombreux éléments qui distinguent Beats. Le mélange de textures et de dégradés, les détails précis au niveau des pixels et le style unique de Bjango font de cette interface un gagnant.

Touche de rêve



Chaque écran de l'interface utilisateur de Dream Touch possède sa propre palette de couleurs avec une seule couleur dominante. Ajoutez-y des effets brillants, un éclairage dramatique et une excellente présentation. Vous faites cette liste..

Sinon Mobile



L’interface Else Mobile dispose d’un système de menus et d’une méthode d’interaction uniques… ses couleurs discrètes, son arrière-plan graphique et ses couleurs lui confèrent une apparence progressive et futuriste..

Remarque: cette interface comporte des aspects de toutes les sections: minimal, graphique et futuriste. Cela ne rentre vraiment dans aucune catégorie, alors je l'ai placé aussi près que possible du milieu..


Section 3: Très détaillé / expérimental

Ces interfaces vous feront réfléchir. Avec ces interfaces, les limites sont dépassées et la convivialité n’est pas toujours la priorité numéro un. Ils ont souvent des formes étranges, des dispositions uniques, un contraste élevé et un niveau de détail très élevé. Il y a presque une sous-culture pour ce type de design et on ne le trouve pas régulièrement dans le grand public.

CYMIC - peau de joueur



L'éclairage unique et les reflets uniques font du lecteur CYMIC un excellent morceau. Ajoutez à cela un jeu de couleurs non standard à contraste élevé, et cette pièce saute vraiment de l'écran.

Quarian



Ok, je devais glisser l'un des miens sur la liste, les gens ont tendance à aimer celui-ci, j'espère que vous aussi. C'est brillant.

Insigne



L'Insignia de Lance Thackeray prend un clavier Midi et un lecteur multimédia et les associe dans une interface utilisateur fantastique fantastique. Chaque morceau de cette interface utilisateur est finement détaillé et son jeu de couleurs discret avec des accents brillants ajoute une touche supplémentaire de classe..


Section 4: Le Futur / Fantasy

Présentes le plus souvent dans les films et les jeux vidéo, ces interfaces ont souvent beaucoup à faire en même temps. Les choses semblent toujours bouger, clignoter, bip-bip, clignotant. En règle générale, les graphiques eux-mêmes ne sont pas très détaillés, mais un cadre complet est toujours quelque chose à voir..

AdvancedUI: écran d'état



AdvancedUI de Zane Bien est une pièce que vous devez voir dans son intégralité. Avec une taille totale de 1454x884, il est énorme mais chaque petit morceau s’accorde parfaitement avec le suivant; les lueurs subtiles et l'utilisation de la couleur sont également fantastiques.

Mark Coleran: Interfaces utilisateur Fantasy



Mark Coleran est un parrain dans ce style et est cité comme source d'inspiration pour la pièce précédente, AdvancedUI. Le travail de Mark a été présenté dans de nombreux films à succès, et la plupart d'entre eux se trouvent également sur son site Web. Assurez-vous de cliquer et de voir les vidéos et les captures d'écran de son portfolio si vous n'êtes pas familier avec son travail..

Ironman PDA UI



Perception a créé de nombreux graphismes d'écran pour le film IronMan 2, l'un des plus remarquables étant la séquence pour PDA. Assurez-vous de regarder la vidéo "Stark PDA Final Shots" sur leur site web. Ce qui était très intéressant, c’est qu’ils ont dû concevoir l’interface utilisateur pour répondre aux gestes simulés que Robert Downey Jr. avait fait à l’avance sur un dispositif vierge et l’avoir ensuite composée pour le plan final..

Écran d'information sur le bateau en 3D



Stereolize a créé une série de concepts d'interface utilisateur pour les écrans d'information sur les yachts. Ce qui aurait pu être une série ennuyeuse de jauges a été transformé en un terrain de jeu visuel, affichant les informations de manière extrêmement intéressante et engageante.


Note de l'auteur

J'ai eu beaucoup de plaisir à trouver toutes ces interfaces utilisateur épiques et à écrire à leur sujet; J'espère que vous avez également apprécié la lecture de mon article. Consultez-moi sur mon site Web ou suivez-moi sur Twitter pour suivre mes dernières découvertes, articles et projets..


Ce post est le jour 9 de notre session de conception d'interface. Sessions créatives "Session 8