Objectifs
Voici les connaissances abordées dans ce cours.
- Apprendre à choisir une police de caractères à dessein
- Savoir exploiter les caractéristiques d’une typographie dans un design d’interface
- Appréhender la logique du responsive design
Mots-clefs
Brief
Œye est un nouveau magazine en ligne. Il propose de découvrir le travail d’un jeune designer graphique chaque mercredi via une interview publiée sur son site. Œye fait appel à vous car il a besoin pour son lancement d’un logo et d’un site web.
Demande
Le site sera divisé principalement en deux vues :
- L'accueil fera figurer une liste des interviews de la plus récente à la plus ancienne. L’interview de la semaine sera mise en avant en haut de liste.
- L’interview présentera le texte de l’entretien de la semaine accompagné d’une sélection des travaux graphiques récents de l’interviewé, sur le modèle de l’Artiste de la Semaine sur Kiblind.
Le client demande un logo typographique et un site ayant une couleur par page. Plus précisément, il désire s’approcher de la chaîne YouTube COLORS dans le principe, à savoir chaque interviewé aura sa couleur. Il a besoin d’un site responsive, vous lui présenterez donc votre maquette en desktop et en mobile.
Votre design devra entièrement reposer sur le caractère d’une typographie. Vous commencerez donc par sélectionner une police ou un couple de polices en vous appuyant sur le Guide pratique de choix typographique de David Rault. Vous devrez être capable d’argumenter ce choix.
Pour le contenu du site, vous mettrez en avant des graphistes dont vous appréciez les travaux et qui mériteraient d’être plus connus. Orientez votre choix vers des travaux avant-gardistes et sortant de l’ordinaire. Si vous manquez d’inspiration, n’hésitez pas à en chercher sur It’s Nice That.
Inspiration
Le client vous fournit à titre d’exemple trois sites car il apprécie leur univers graphique :
Rendu et notation
Le rendu s’effectuera par mail à l’adresse mayliscours@wearemd.com. Vous trouverez ci-dessous la liste exhaustive des dossiers / fichiers à inclure dans votre rendu. Veillez à respecter la convention de nommage demandée (avec des tirets).
design-thinking-sujet-4-prenom-nom |
|---|
export |
1-desktop |
1-accueil.jpg |
2-interview.jpg |
2-mobile |
1-accueil.jpg |
2-interview.jpg |
polices |
nom-de-la-fonte.otf |
source |
logo.ai |
site.sketch |
Voici les critères de notation pour ce sujet.
| /20 | |
|---|---|
| /10 | Adéquation de la proposition graphique avec le brief |
| /8 | Structuration logique du layout en desktop et mobile (utilisation de la grille et de l’échelle typographique) |
| /2 | Tous les fichiers demandés fournis, organisés et nommés correctement |