Justine Lsr
Directrice Artistique & Product Designer

ARS Paca

CLIENT ARS Provence-Alpes-
Côte d'Azur
ANNÉE 2025
RÔLE Architecture de l'information,
arbitrages UX/UI,
déclinaison graphique
LIVRABLES Cadrage des publics,
schéma de structure et wireframe,
maquette desktop et mobile

Rendre lisibles les missions d'une agence régionale de santé sur une seule page.

Voir la maquette →

Réalisé dans le cadre d'un appel d'offres, ce site célébrant les 15 ans de l'ARS Paca valorise les missions et l'impact de l'agence sur le territoire. J'ai conçu en autonomie l'architecture et la déclinaison graphique.

L'enjeu : une page longue et volontairement globale, construite autour des thèmes et des valeurs de l'agence, qui doit rester compréhensible par un public non spécialiste sans entrer dans le détail technique.

Maquette de la page d'accueil ARS Paca sur ordinateur
00

Le point de départ

LA DEMANDE « Un site pour nos 15 ans » Une page anniversaire valorisant les missions de l'agence. Sans public prioritaire défini, sans hiérarchie de contenu, et tout sur une seule page.
CE QUE J'AI APPORTÉ Une structure avant une esthétique Avant de maquetter, trancher les angles morts : qui lit la page, dans quel ordre, et où placer les appels à l'action.
LE CLIENT REPART AVEC Une proposition argumentable Cadrage des publics, wireframe, maquettes desktop et mobile. Chaque section justifie sa place : défendable en commission, reprenable en développement.
01

Des publics et leurs besoins

Le brief ne désigne pas un public unique. J'ai donc posé trois hypothèses — grand public, professionnels de santé, partenaires institutionnels — et retenu le grand public comme public prioritaire : c'est celui qui connaît le moins l'agence et pour qui l'effort de pédagogie est le plus fort.

PUBLIC CE QU'IL CHERCHE CONNAISSANCE DE L'ARS
Grand public
PRIORITAIRE
Comprendre à quoi sert l'agence, ce qu'elle porte dans sa région, et où s'adresser en cas de besoin. Faible — le sigle est connu, le rôle rarement. Tout le vocabulaire doit être explicité.
Professionnels de santé Retrouver rapidement le thème qui les concerne et l'accès au contenu de référence associé. Élevée — attend un accès direct, pas une introduction.
Partenaires & collectivités Situer l'agence et ses engagements sur le territoire, et identifier les bons interlocuteurs. Moyenne — connaît l'institution, cherche des preuves et des contacts.

Ces publics sont des hypothèses de travail issues du brief d'appel d'offres. Elles n'ont pas été confrontées à des entretiens utilisateurs : elles ont servi à arbitrer, pas à conclure.

02

L'architecture de l'information

La page n'est pas organisée par services mais par thèmes et valeurs de l'agence : après l'introduction des 15 ans, chaque thème occupe sa propre section — parfois deux lorsqu'il est trop large pour un seul écran. L'objectif est de rester global et lisible, pas exhaustif.

01 · OUVERTURE « 15 années au service de votre santé » L’anniversaire comme porte d’entrée : ce que l’agence protège et améliore, en une phrase, avec un premier En savoir plus.
02 · ANCRAGE TERRITORIAL « Au cœur de la santé de votre région » Le rôle de l’ARS auprès des citoyens et des soignants, et sa mission de préparation des enjeux de demain.
03 · LES TROIS ENGAGEMENTS Prévenir & protéger · Accompagner les soins · Être aux côtés de tous Le triptyque de valeurs, posé en repères courts avant les thèmes détaillés : c’est la clé de lecture de toute la page.
04 · RÉFÉRENCE « La référente sur les thématiques de santé du territoire » Quatre missions listées et numérotées : piloter la prévention, observer les besoins, coordonner les acteurs, déployer des actions locales.
05 · SERVICE PUBLIC « Un établissement public au service de la santé des citoyens » Le statut et l’intérêt général : accès aux soins, parcours de vie, réponses aux enjeux sanitaires.
06 · IMPACT « Son action a un impact sur les prises en charge » Autorisations, financements, accompagnement des établissements : ce que les décisions de l’agence changent.
07 · CONTACT « Envie d’en savoir plus ? Contactez-nous » Formulaire court — nom, adresse mail — sur un visuel du territoire, en clôture de lecture.

Les trois engagements (03) fonctionnent comme un sommaire implicite : les thèmes qui suivent — la référence territoriale, le statut d’établissement public, l’impact sur les prises en charge — les déclinent un par un. Le thème de la référence territoriale est le seul à occuper deux blocs, parce que les quatre missions demandaient une lecture à part.

Les En savoir plus ne sont placés que sur les thèmes qui ouvrent réellement sur un contenu détaillé (ouverture, service public, impact). Les engagements et le bloc de missions restent en lecture seule : ajouter un bouton partout aurait dilué le geste et fait promettre des pages qui n’existaient pas.

Wireframe de la page ARS Paca : ouverture 15 ans, ancrage territorial, les trois engagements, les thématiques de santé, le service public, l'impact, le contact
Le wireframe de la page : l'ordre des thèmes, l'alternance texte / image d'un bloc à l'autre et les emplacements de CTA.
03

Les arbitrages UX/UI

Trois décisions structurent la maquette : une hiérarchie de titres qui permet de lire en diagonale, un découpage thématique en blocs courts, et des photographies qui installent le territoire sans porter d'information.

Extrait de maquette — introduction et hiérarchie des titres
EXTRAIT 01 — HIÉRARCHIE Le besoin. Savoir en trois secondes de quoi parle la page. La décision. Un seul titre de niveau 1, des titres de section très contrastés en taille, et aucun sous-titre décoratif entre les deux. Le bénéfice attendu. La page se parcourt par ses titres seuls, à l'œil comme au lecteur d'écran.
Extrait de maquette — thématiques de santé et découpage des textes
EXTRAIT 02 — DÉCOUPAGE Le besoin. Parcourir une page longue sans se perdre entre les thèmes. La décision. Un thème par bloc, une idée par paragraphe, des mesures de ligne courtes, et un CTA uniquement là où un contenu détaillé existe. Le bénéfice attendu. Le propos reste global et tenable, sans promettre un niveau de détail que la page n'a pas.
Extrait de maquette — photographies et accès aux contenus détaillés
EXTRAIT 03 — PHOTOGRAPHIE & ACCÈS Le besoin. Incarner l'action de l'agence sans alourdir la lecture. La décision. Des photographies en respiration entre les sections, jamais porteuses d'information seule, et des liens explicites vers les contenus détaillés. Le bénéfice attendu. Un rythme de lecture, et une information qui reste accessible si l'image ne se charge pas.
04

Le mobile et l'accessibilité

Sur petit écran, la page longue devient une succession de blocs thématiques pleine largeur. Chaque section garde son titre, son visuel et, le cas échéant, son CTA ; le contact reste atteignable sans revenir en haut.

Maquette mobile de la page ARS Paca : ouverture 15 ans, bouton En savoir plus, photographie pleine largeur puis bloc d'ancrage territorial
L'ouverture en version mobile : un titre sur deux niveaux, un paragraphe court, un seul CTA, puis les blocs thématiques en pleine largeur.
CONTRASTES Le texte courant est posé en encre pleine sur fond clair, sans texte en aplat de couleur ni sur photographie. Les rapports visés sont ceux du niveau AA : 4,5:1 pour le texte, 3:1 pour les titres.
LIENS Les liens sont soulignés ou bordés, jamais signalés par la seule couleur, et leur intitulé annonce la destination — pas de « en savoir plus » isolé.
TAILLES DE TEXTE 16 px minimum pour le texte courant sur mobile, titres fluides, et aucune hauteur fixe sur les blocs de texte : l'agrandissement du corps ne coupe pas le contenu.
ÉTATS DE FOCUS Chaque élément interactif garde un contour de focus visible, distinct du survol, et les zones tactiles font au moins 44 px.
VÉRIFICATIONS RÉELLES Contrastes mesurés sur les paires de couleurs de la maquette, navigation au clavier et lecture des titres seuls testées sur la page. Ces contrôles portent sur la maquette, pas sur un site en production.

Limites : pas de test avec des utilisateurs en situation de handicap, pas d'audit RGAA complet, et pas de vérification sur lecteur d'écran réel. Les points listés sont des intentions de conception vérifiables, à confirmer en phase de développement.

05

La maquette

La page complète, dans l'ordre de lecture retenu : l'ouverture sur les 15 ans, l'ancrage territorial, les trois engagements, puis les thèmes qui les déclinent, et le contact.

Maquette du site ARS Paca
→ Voir tous les projets
ACCÈS RAPIDE
01 À propos Je suis Justine, directrice artistique & product designer. Mon parcours s'est construit entre agences, institutions et projets indépendants. → 02 Prestations Direction artistique, identité visuelle, product design et web design. Des prestations adaptées à chaque projet et à chaque besoin. → 03 Contact Un projet ou une collaboration en tête ? Contactez-moi pour en discuter. →