Chaque proposition a été traduite en douze écrans HTML interactifs, avec un système de design complet : typographie, palette, composants, états, animations. Toutes les vues sont statiques (aucun backend) mais reflètent l'expérience utilisateur finale.
10
Propositions distinctes
120
Écrans HTML produits
11
Captures d'écran source redesignées
100 %
En français (Suisse romande)
Choisissez une proposition
Cliquez sur une carte pour explorer les douze écrans, le système de design, et la justification des décisions.
Onze captures d’écran couvrant six flux utilisateurs ont été analysées. Voici les observations structurantes qui ont guidé la conception des dix propositions.
Observations principales
·
Style visuel daté (ère 2003-2008)
L'interface actuelle est honnête et fonctionnelle, mais visuellement ancrée dans les années 2000. Elle ne reflète pas la qualité de l'information qu'elle porte. Pour un outil B2B professionnel, ce décalage érode la confiance perçue.
·
Encadrement excessif par bordures rouges
Chaque section est entourée d'un cadre rouge 1pt, créant un bruit visuel constant. La page devient le cadre, le contenu devient le texte à l'intérieur. Ce pattern empêche toute hiérarchie visuelle de respirer.
·
Densité d'information élevée mais organisation faible
Le répertoire affiche 20+ entreprises par page, mais la structure visuelle (hiérarchie, groupement, respiration) est insuffisante pour traiter cette densité efficacement. Plus d'information ≠ plus de valeur perçue.
·
Le rail gauche consomme 30% de l'écran
L'accordéon latéral occupe environ 30% de la largeur sur un laptop 1366px, ne laissant que ~900px pour le contenu. C'est le problème dominant d'utilisabilité sur les écrans de taille intermédiaire (le format dominant chez les conseillers).
·
Recherche enterrée comme catégorie
La recherche est une sous-catégorie dans le rail gauche ('Search > Travel Offers / Travel Directory') plutôt qu'une action de premier plan. Le brief identifie la recherche comme cas d'usage principal — le design actuel la traite comme une rubrique mineure.
·
Aucun feedback d'action
Après avoir cliqué 'Chercher', aucun toast, aucune confirmation, aucune progression. L'utilisateur attend sans signal. Sur un outil professionnel, cette absence crée de l'anxiété : 'est-ce que ça a marché ?'
·
Contrôles natifs du navigateur
Les dropdowns gris et inputs HTML natifs donnent une impression 'inachevée'. Pour un produit premium, les composants personnalisés sont attendus et signalent le soin du détail.
·
Pas de vision transversale ni de raccourcis
L'utilisateur navigue module par module sans vision d'ensemble. Pas de 'vue client', pas de raccourcis, pas de recherche cross-module. Le travail multi-entité (gérer un client qui voyage vers 5 destinations) est pénible.
Forces à préserver
+
Densité d'information réellement élevée.Le répertoire affiche 20+ entreprises par pli, avec adresse, type, code postal, ville. La plateforme assume la densité là où d'autres la craignent.
+
Architecture de l'information complète.Chaque tâche principale (trouver une entreprise, consulter un visa, chercher un emploi) est atteignable en deux clics. La structure est solide.
+
Page tour-opérateur = avantage concurrentiel.C'est l'écran le plus riche de la plateforme : logo, spécialités, contacts par région, offres avec PDF. C'est exactement le type de ressource que les plateformes B2B concurrentes peinent à répliquer.
+
Support bilingue structurellement propre.Le rail gauche ne casse pas sous la longueur des libellés allemands. Le choix typographique respecte les deux langues.
+
Magenta distinctif, fonctionne en accent.La couleur de marque Kendros fonctionne bien en accent. Elle doit rester.
Opportunités de design
Promouvoir la recherche au rang global
La décision de design la plus à fort impact : faire de la recherche un contrôle persistant en haut de page, pas une catégorie dans un rail. Cette seule modification réduit la charge de navigation, élimine le problème dominant du laptop, et aligne l'interface avec le cas d'usage principal du brief. Les 10 propositions adoptent ce choix, chacune à sa manière.
Remplacer le rail par une navigation moderne
Un rail latéral collapsed-by-default, expanded-on-demand, libère 20% de l'espace horizontal et modernise la perception immédiatement.
Introduire la personnalisation
Recherches sauvegardées, watchlists, activité récente. Pour un outil B2B quotidien, la valeur de chaque visite augmente avec la mémoire de l'utilisateur.
Restructurer la fiche tour-opérateur
La page détail la plus riche mérite d'être l'écran vitrine : contacts par région clairement hiérarchisés, offres en avant, fonds de garantie visible mais intégré.
Adopter un système typographique bilingue
Un système qui gère le français et l'allemand sans casse de mise en page — pas de troncature, pas de débordement, hiérarchie préservée dans les deux langues.
Insight stratégique
La décision de design la plus à fort impact est de promouvoir la recherche au rang de contrôle persistant en haut de page. Cette seule modification réduit la charge de navigation, élimine le problème dominant du laptop, et aligne l’interface avec le cas d’usage principal du brief. Les dix propositions adoptent ce choix, chacune à sa manière.
Inventaire des écrans source
Onze captures d’écran, cinq flux utilisateurs. Chaque proposition redesigne l’intégralité de ces écrans, avec les états complets (authentification, recherche, résultats, détail, vide, erreur, confirmation).
01
Authentification
· Connexion par identifiants · 3 écran(s)
Note : Le login suggère une structure multi-tenant (un compte, plusieurs postes par agence) mais la sélection d'utilisateur n'est pas clairement exposée.
02
Annuaire (Whoswho)
· Recherche et listing de contacts · 2 écran(s)
Note : Densité élevée : 20+ résultats avec adresse, type, code postal. Le placeholder 'No Info' est fonctionnel mais non informatif.
03
Visas & Ambassades
· Filtrage par destination · 2 écran(s)
Note : Sélection par pays, table de résultats avec durée de séjour et conditions. L'écran résultat manque de hiérarchie visuelle entre les différents pays.
04
Tour-opérateurs
· Recherche et détail · 3 écran(s)
Note : L'écran le plus riche : logo, spécialités, contacts par région (Commentaires), offres en cours. Le bloc Commentaires/Contacts devient une liste plate non structurée.
05
Emplois
· Liste d'offres et inscription newsletter · 1 écran(s)
Note : 5 à 10 offres curated. Le formulaire d'inscription newsletter est présent mais pas de job board visible — la découverte d'emploi se fait principalement via la newsletter.
Matrice comparative
Les dix propositions évaluées sur sept critères identiques. La matrice se lit en ligne (un proposal en détail) ou en colonne (quels proposals excellent sur une dimension donnée).
Les dix propositions se regroupent en trois familles naturelles. Le choix de la direction viendra probablement d’une de ces familles plutôt que d’un proposal isolé.
CLUSTER A
Cluster A — Confiance et tradition
Trust-first. Optimisé pour l'audience existante. Modernisé, mais volontairement non-disruptif.
Le brief démographique (25–65, familiarité informatique moyenne à faible). Plus haute confiance managériale, plus bas risque d'implémentation. Choix défendable sur le long terme.
Outil-first. Optimisé pour power users et densité d'information.
Utilisateurs qui traitent Kendros comme un outil quotidien, pas une référence ponctuelle. Plus disruptif sur les workflows existants, payoff d'information plus élevé. Coût d'implémentation plus haut mais uplift UX aussi plus marqué.
Kendros qui assume un positionnement haut de gamme et accepte de prendre un risque pour se démarquer. Toutes trois ont un caractère éditorial ou expérimental qui les rend mémorables mais moins consensuelles.
Sur les dix propositions, trois forment ensemble un système cohérent et complémentaire.
Sur les dix propositions, trois forment ensemble un système cohérent et complémentaire. Elles ne sont pas interchangeables : chacune adresse une couche distincte de l'expérience, et c'est leur combinaison qui délivre la valeur maximale. Voici la composition recommandée.
PROPOSITION 01
Swiss Atelier
— La couche visuelle et tonale
Identité éditoriale raffinée, palette restreinte, typographie serif pour les titres. Définit le ton, la confiance, la longévité. Sans cette fondation, les autres couches paraissent plaquées.
Pour la direction : Les cadres dirigeants reconnaîtront Swiss Atelier comme une esthétique premium, confiante, incontestablement européenne. Elle signale que Kendros est un acteur sérieux, qui ne court pas après la mode — et qui sera encore actuel en 2030.
Pour les utilisateurs : Les utilisateurs gagnent une expérience plus calme, plus lisible, plus rapide à scanner. La densité d'information est préservée (même nombre de fiches par page) avec moins de bruit. Le segment 55+ apprécie particulièrement les cibles plus grandes, la hiérarchie claire, et l'absence de design qui en fait trop.
Périmètre : Toute la plateforme · particulièrement la home, les fiches, les exports PDF
Tableau de bord centré sur l'utilisateur, collections sauvegardées, suggestions contextuelles. Réduit le temps de retour à l'information et augmente la valeur perçue de chaque visite.
Pour la direction : My Kendros transforme la plateforme d'un annuaire à consulter en un outil de travail personnel. La fidélité augmente quand l'utilisateur a investi du temps à organiser ses propres collections.
Pour les utilisateurs : L'utilisateur qui revient après un appel ou une pause reprend exactement là où il était. Pour un conseiller qui gère 5 clients simultanément, c'est une économie de 2 heures par semaine. La confiance augmente car l'information est toujours retrouvable.
Recherche omniprésente (⌘K), résultats inline instantanés, raccourcis clavier. Unifie l'accès aux 4 modules (annuaire, visas, tour-opérateurs, emplois) et résout le problème dominant du laptop.
Pour la direction : C'est la modification à plus fort impact par euro investi. La recherche globale est l'attente moderne de base d'un outil professionnel. Sans elle, la plateforme semble datée quelle que soit la beauté du reste.
Pour les utilisateurs : Pour un conseiller traitant 30 dossiers par jour, le gain est mesurable : 1,5 seconde par action économisée × 200 actions = 5 minutes / jour. Plus important : la charge cognitive baisse car l'utilisateur n'a plus à décider 'où chercher' avant chaque tâche.
Périmètre : Header global · palette de commandes (Cmd+K) · filtres inline
Trois phases successives, indépendamment livrables.
L'intégration fonctionne en couches successives :
• Phase 1 (Semaines 1-6) : P01 Swiss Atelier — pose le ton visuel sur l'ensemble de la plateforme. C'est la fondation sans laquelle les autres directions paraîtraient incohérentes.
• Phase 2 (Semaines 5-10) : P05 My Kendros — ajoute la couche personnelle par-dessus le visuel. La home devient un tableau de bord, les collections apparaissent.
• Phase 3 (Semaines 9-14) : P06 One Search — la couche navigation unifie l'accès. Cmd+K s'ajoute en haut, les modules se simplifient car la recherche prend le relais.
Les phases se chevauchent légèrement. Chaque phase est indépendamment livrable et présentable à la direction comme une amélioration visible.