Les parcs nationaux américains passent du papier aux pixels avec Figma
Comment concevoir une application pour 431 parcs et monuments nationaux ? Tout simplement en s'inspirant des brochures historiques du National Park Service. Découvrez comment une équipe réduite s’est approprié le design system précurseur de Massimo Vignelli pour l’adapter à une interface numérique.
Partager Les parcs nationaux américains passent du papier aux pixels avec Figma
Illustration principale par Chantal Jahchan
Quand on pense aux parcs nationaux américains, des images de paysages grandioses viennent à l’esprit, comme les falaises de granit de Yosemite, ou encore les canyons tortueux de Zion. Cependant, le National Park Service (ou NPS) gère 431 lieux d’une diversité stupéfiante, dont certains sont tout petits, comme le modeste bâtiment du Thaddeus Kosciuszko National Memorial en Pennsylvanie. Aider le public à s’orienter et à se repérer au sein de ces lieux si divers a été à la fois un objectif fondamental et un défi depuis le début du XXe siècle, au moment où le NPS a commencé à imprimer des brochures pour guider ses visiteurs.
Les choses ont changé à l’arrivée du numérique. En 2016, le NPS a demandé au studio GuideOne de développer une application pour chaque parc avant de prendre la décision de les consolider en une seule app, lancée en 2021. Au vu de la taille du réseau de parcs, créer une application unifiée n’était pas une mince affaire. « C’est compliqué à gérer car de nombreux parcs contrôlent leurs données et font leur propre communication, » explique Juan Sanabria, fondateur de GuideOne. « Créer un système qui fonctionne pour tous les lieux et qui héberge toutes ces informations a été un sacré challenge. » La durabilité et l’accessibilité ont également été des préoccupations centrales, comme le dit son collaborateur Kevin Twohy, fondateur du studio de design Twohy Design Works : « Ce qui est intéressant avec les applications du secteur public, c’est qu'elles doivent durer longtemps, et que de nombreuses personnes avec différents besoins d’accessibilités vont les utiliser. »
Pour définir le chemin à suivre, Juan et Kevin se sont tournés vers le passé, examinant de près l’emblématique Unigrid System, de Massimo Vignelli, qui a codifié le design et la production des brochures des parcs. Tout au long du processus, Figma a facilité la communication entre les collaborateurs, dont l’équipe des parcs et l'équipe de développement de GuideOne, qui a donné ses recommandations concernant la faisabilité technique et la gestion des données des parcs. Le résultat ? Une application solide, au service des personnes qui partent à la découverte des parcs nationaux américains et des employés qui les gèrent.
Avec le programme d’amélioration du design fédéral de 1972, le gouvernement américain a encouragé les agences comme la NPS, la NASA, l’USPS et l’EPA à moderniser leurs standards de design.
L’adaptation de l’Unigrid
Pendant pratiquement toute leur histoire, les brochures du NPS ont été dotées de graphismes hétéroclites et présentaient différents formats. Il y a eu du changement en 1977, quand l’organisation a demandé au designer reconnu Massimo Vignelli de créer un système permettant de standardiser les composants graphiques et la production de toutes ses publications imprimées.
En créant le système Unigrid, Vignelli n’a pas seulement rendu le design et la publication plus efficaces et économiques, mais il a aussi forgé pour les parcs nationaux une identité cohérente et reconnaissable, à une époque où ils étaient encore mal connus des Américains. Le système Unigrid comprend une police de caractères maison (Helvetica), des couleurs spécifiques, des indications concernant le traitement des plans et des illustrations. Son approche s’appuie sur une grille de base (par opposition à des lignes de pliage) qui organise le contenu. Les lignes verticales et horizontales de la grille délimitent 12 panneaux de chaque côté de la page, qui permettent aux designers de disposer du texte, des images et des plans de façon harmonieuse et évolutive. Le système Unigrid est si efficace qu’en 1985 il gagne le Presidential Design Award, décerné par le National Endowment for the Arts pour « avoir répondu aux principaux besoins que doit satisfaire un design system en réduisant le nombre de décisions liées aux tâches quotidiennes, permettant aux designers de concentrer leurs efforts sur la qualité. »
Pour assurer l’accessibilité de l’app, chacune des pages est compatible avec la voix off, et les descriptions audio s'affichent par défaut.
Le système Unigrid, dont les modules de contenu tiennent lieu de composants de design system, a servi de point de départ au design de l’application. Juan et Kevin avaient besoin d’un template capable d’afficher des informations comme les équipements, les tarifs, les billets, les actualités et les événements, mais aussi les recommandations sur les points d’intérêts, les activités, les hébergements, les visites auto-guidées, les expériences de réalité augmentées, et d’autres caractéristiques spécifiques à chaque parc. « En termes de contenu et de volume, il existe un écart important entre les parcs les plus grands et les plus petits, » explique Kevin. « Il nous fallait un système qui puisse être appliqué à tous les lieux. » L’application organise les pages via une grille réactive qui modifie la taille des pavés en fonction du contenu disponible.
Prenons l’exemple du parc national d’Acadia, qui s’étend sur plus de 20 000 hectares dans le Maine, le long de la côte atlantique. Plutôt bien remplie, sa page comporte des images et des composants, comme un plan, des ponts historiques et des centres d’accueil pour les visiteurs. La page du Thaddeus Kosciuszko National Memorial, quant à elle, est moins bien garnie. « Il y a moins de personnel, donc pas de caractéristiques particulières ou de visites guidées, » raconte Kevin. La taille des pavés est modifiée de façon à mieux remplir la page. Sur iPad, le contenu est réparti sur trois colonnes au lieu de deux.
Dans le même esprit que le système Unigrid, cette approche modulaire offre un design cohérent et élégant, même avec un contenu limité, le tout sans que le personnel de chaque parc n’ait besoin d’imaginer ses propres mises en page. Les employés peuvent facilement uploader des images, du texte et d’autres ressources pour remplir chaque pavé et transformer la brochure de leur parc en interface numérique.
Priorité à l’orientation
Les brochures des parcs ont toujours eu comme rôle de présenter la configuration des lieux aux visiteurs, et il en va de même pour l’application. En plus de la vue en pavés, chaque page de parc comporte un bouton d'action flottant qui permet aux utilisateurs d’explorer la zone grâce à une vue plan. Ainsi, les utilisateurs peuvent cliquer sur des tuiles spécifiques (par exemple, les lieux à visiter et les activités) et afficher une liste de lieux ou voir un plan. « Une des principales difficultés de la conception pour mobile réside dans le fait qu’une partie de la population est visuelle et préfère se repérer avec un plan, alors que d’autres personnes préfèrent s’appuyer sur du texte et des listes, » explique Juan. La possibilité de basculer d’un mode à l’autre ressemble à l’expérience de lecture d’une brochure de parc, où le recto comporte principalement du texte, et le verso des plans Les utilisateurs peuvent aussi télécharger des plans à consulter lorsqu’ils sont hors ligne, ce qui s’avère assez pratique lors d’une visite de la Death Valley ou de Joshua Tree, où le réseau mobile est limité.
Lorsque les utilisateurs planifient leur visite, ils peuvent découvrir et enregistrer des lieux en recherchant des thèmes ou des activités comme la randonnée, l’escalade, les sports d’eau, l’observation d’oiseaux ou d’étoiles.
Tout comme les gardes forestiers proposent des itinéraires personnalisés ou des balades à visée éducative, l’application offre des visites auto-guidées, dont certaines sont accompagnées de commentaires audio. En Acadie, par exemple, les visiteurs peuvent se promener le long de Bass Harbor et de Southwest Harbor en passant devant une série de panneaux d'information extérieurs.
Juan et Kevin travaillent avec l’équipe de cartographie du NPS pour ajouter les plans des brochures Unigrid en complément des cartes satellite par défaut. En tant que structure gouvernementale soumise à des obligations en matière d'accessibilité, chaque parc doit fournir des descriptions audio avant d'inclure des plans, ce qui est encore en cours.
Diffusion d’alertes
Les brochures délivrent des informations essentielles, qu’il s'agisse de conditions dangereuses, de zones fermées, ou tout autre élément qui pourrait avoir un impact sur les visites. Dans le même esprit, chaque page de parc comporte un bandeau d’alerte attirant l’attention sur les informations importantes, l’avantage étant que l’application peut être mise à jour en temps réel, contrairement aux brochures qui doivent être imprimées et distribuées à nouveau. Cependant, toutes les alertes ne sont pas au même niveau, comme l’explique Kevin : « Une alerte peut servir à mettre en garde contre la présence de bisons, mais elle pourrait aussi avertir d’un risque de crue subite. » Pour faire la différence entre les mises à jour pérennes et les annonces plus urgentes, Kevin et Juan ont itéré sur d'autres moyens de faire apparaître les alertes qui ne sont pas encore en ligne, comme par exemple un bouton d'alerte flottant ou une tuile d'alerte sur la grille d'accueil.
Développer de nouvelles expériences
Des expériences de réalité augmentée dépassant ce que peut offrir une brochure imprimée ou une exposition de bord de route ont récemment été intégrées à l’application. Au parc national de Yellowstone par exemple, les utilisateurs peuvent afficher un outil qui les aide à visualiser les distances de sécurité à conserver avec les ours, les loups et autres animaux sauvages. À Antietam National Battlefield, vous pouvez voir comment les troupes se sont déployées sur les champs de bataille pendant ce qui est considéré comme « le jour le plus meurtrier de l'histoire des États-Unis ». Juan souligne : « Physiquement, le lieu est vide, mais la réalité augmentée permet de faire revivre les événements. » Un projet actuellement en cours permettra aux utilisateurs de pointer leur appareil photo sur Independence Hall et de visualiser la scène de signature de la Déclaration d'Indépendance.
L’application propose également des tampons de passeport pour chaque parc, ce qui permet aux collectionneurs de les voir sans bouger de chez eux.
Créer le prototype du futur
Pour Juan et Kevin, mener des brainstormings et concevoir dans Figma a fluidifié le processus d’amélioration graphique et la création de nouvelles fonctionnalités. Tout commence dans FigJam : Juan y pose quelques croquis et des notes sur les nouveautés évoquées avec l’équipe du NPS, qui s’implique de l'idéation à la décision finale, en passant par l'itération. « Le National Park Service nous a laissé une grande liberté créative, et nous coordonnons nos efforts sur la base de flux de données constamment mis à jour, » raconte Juan. « Ils nous proposent souvent des fonctionnalités et nous aident à développer nos idées. »
Kevin transforme ensuite ces croquis en wireframes ou en prototype, à partir desquels chacun peut itérer. « Cette approche reflète la pensée de Kevin en matière de design et permet des allers et retours au sein du processus », explique Juan. « Je peux jeter quelques idées en vrac dans un FigJam, et il est ensuite facile de les traduire en fichiers de design plus structurés. En général, ces choses se passent au fil de notre travail, et cela nous aide à communiquer notre idée. »
Voici 23 ressources pour les prototypes à mettre dans vos favoris.
Créer des prototypes au fur et à mesure permet d’expérimenter rapidement. « Même si un design n’est fini qu’à 20 %, vous pouvez toujours créer un prototype dans Figma qui semble terminé à 90 %, » dit Kevin. « Auparavant, créer un prototype prenait une heure et demie, donc je n’aurais envoyé que des captures d’écran. » Figma facilite également la consultation des designs et la prise en compte des retours des collaborateurs, sans avoir à gérer les versions des fichiers. « Figma a apporté un incroyable changement à notre workflow, » affirme Kevin. Une fois le design final arrêté, l'équipe de développement de GuideOne concrétise la vision.
Même si un design n’est fini qu’à 20 %, vous pouvez toujours créer un prototype dans Figma qui semble terminé à 90 %.
Regard sur l'avenir
Le NPS ayant lancé une nouvelle initiative de recherche utilisateur, les informations sur la façon dont les visiteurs utilisent l'application avant, pendant et après leur voyage continueront à orienter les améliorations. Par exemple, l'équipe a supposé que la plupart des visiteurs commençaient leurs recherches sur le web avant de passer à l'application une fois arrivés sur place. Les visiteurs les plus jeunes, en revanche, se fient entièrement à l'expérience mobile. Pour répondre à la demande générale, les utilisateurs pourront bientôt créer des comptes afin de sauvegarder leurs lieux, excursions, photos et autres éléments favoris.
Les brochures Unigrid ont été un moyen efficace de resserrer les liens entre les visiteurs des parcs et leur personnel passionné. En s'inspirant de leur héritage, l'application NPS invite une communauté plus large et la nouvelle génération à découvrir et à préserver le patrimoine culturel et historique de l'Amérique.
