New York
00:12

Paris
06:12

AREA 17

AREA 17

/
AREA 17
Index

Pentagram

La référence du design

Plus grand cabinet indépendant de conseil en design au monde, Pentagram n'a plus besoin d'être présenté. Travaillant pour un large éventail de clients, le design de Pentagram s’est fait une place dans notre culture et est présent dans notre vie quotidienne.

Après des années d’une collaboration avec entamée avec la refonte du site d'Adweek en 2011 avec Luke Hayman et poursuivie au fil des années avec Michael Bierut sur des projets tels que Billboard Magazine, Library of America ou Charlie Rose, nous étions dans une position unique pour créer pour Pentagram un site qui réponde à leurs standards élevés de design et performance.

« En tant que consultant, je ne peux imaginer pire qu'un client avec 20 associés égaux, chacun d'entre eux avec des opinions tranchées et un fort caractère. AREA 17 a non seulement fait un excellent travail sur notre site, mais a su structurer un processus qui a conduit à des discussions intéressantes, des décisions claires et un résultat que nous pouvons revendiquer comme la meilleure expression de notre pensée et de notre travail. » — Michael Bierut

Pentagram a été développé avec Twill, notre CMS open-source basé sur Laravel.

pentagram.com

/
Pentagram 01a Home
Mise en avant de projets récents ou emblématiques sur la pag

Notre approche pour le site visait à offrir moins de points d’entrée, mais à guider le visiteur et lui fournir des informations de contexte et un accompagnement tout au long de sa visite. Nous voulions concevoir une expérience de navigation facilitant la recherche et la découverte au sein du si vaste portfolio de l’agence. Conformément aux valeurs de Pentagram, le design visuel et l’architecture du site sont au service de la mise en valeur des travaux de l’agence derrière lesquels ils s’effacent. Des animations subtiles, élégantes et fonctionnelles fournissent des indications sur les parcours et fonctionnalités rendant la navigation sur le site intuitive et agréable.

/
Pentagram 09aa Tablet Home Pentagram 09b Tablet Home Pentagram 09c Tablet Home Pentagram 09d Tablet Home Pentagram 09e Tablet Home
Sélection de travaux au dessus du fold sur la page d'accueil
/
Pentagram 02a Case Study Pentagram 02b Case Study
Les études de cas incluent vue images et "story" combinées

Avec plus de 1000 projets réparties entre divers disciplines, il était essentiel que le CMS permettent à chacun des 20 associés de concevoir et saisir comme il le souhaite ses projets. Utilisant Twill, notre CMS open-source basé sur Laravel, nous avons créé un système modulaire avec des grilles fixes et fluides de façon à ce que chaque projet puisse être optimisé pour servir au mieux son contenu visuel.

Toutes les images d’études de cas s’ouvrent en diaporama plein écran. Pour certains projets, une vue «secondary story» permet de diviser l’écran en deux parties autonomes, un récit et un panneau de visuels.

/
Pentagram 02e Case Study
/
Pentagram 11d Tablet Pentagram 11e Tablet Pentagram 11f Tablet Pentagram 11g Tablet Pentagram 11h Tablet
Image grand format en mode lightbox
/
Pentagram 01a Work Pentagram 01c Work Pentagram 01c Work
Différentes façons de découvrir 35 ans de travaux
/
Pentagram 01d Search
« Type to search » sur plus de 1000 projets

Nous voulions créer une archive que l’on puisse découvrir et parcourir en toute fluidité de multiples façons. La section “Work” du site est organisée principalement par type de client et type de projet avec une vue alternative qui regroupe l’ensemble des travaux. Les deux vues ont une grille et des fonctions légèrement différentes, renforçant les différents angles au travers desquels on peut explorer les projets.

Ne laissant rien au hasard, un puissant outil de recherche s’affichant au-dessus de la page principale, est accessible à tout moment.

/
Pentagram 20a Mobile
/
Pentagram 20b Mobile Pentagram 20c Mobile Pentagram 20dd Mobile Menu

Le site n’est pas seulement une vitrine de la production prolifique de Pentagram. C’est aussi un hub de leur nombreuses contributions à l’industrie du design au travers d’un feed de news regroupant articles, podcasts et interventions à des conférences et événements.

/
Pentagram 04 News
Un feed des dernières actualités
/
Pentagram 06 Partners
La page Partenaires sur fond noir pour créer le contraste
/
Pentagram 05 Contact