Addland devient Tytl : un site pour découvrir, un outil pour travailler

Un nouveau visage mais toujours la même vision : dans un secteur compétitif comme l’immobilier, il est devenu essentiel de réussir à s’affirmer. Se démarquer, se repenser, se réinventer, c’est le défi que se lance Addland avec cette refonte. Évidemment, changer son identité ne se résume pas à de jolies couleurs et une nouvelle typographie, ça c’est la partie qui met des paillettes dans les yeux :)

Avec Tytl, nous posons et repensons la façon de présenter la marque et le site. Quelles sont les cibles ? Comment faciliter l’expérience dans une plateforme B2B2C qui offre autant de possibilités, en impactant au minimum les utilisateurs d’une plateforme déjà bien ancrée dans cette industrie ?

Réinventer une expérience produit complète sans perdre ses utilisateurs, c’est un peu le mot d’ordre de cette refonte.

Un chantier d’ampleur nous attend. L’intégralité du site doit être refondue évidemment, mais il faut aussi penser la refonte au global : template des emails, supports de communication…

L’enjeu de la refonte est de transformer le site actuel en un site marketing et l’application en mode SaaS en un vrai outil métier.

Une étape clé de ce début de projet est de réussir à maîtriser l’effort pour cette refonte : il faut faire des choix. Avec l’équipe projet, nous avons cartographié tout le site pour avoir la vue d’ensemble des pages à refondre.

Nous avons finalement établi que nous travaillerons la refonte par gabarit de page en laissant aux développeurs en interne le soin d’adapter ensuite au reste du site.

En parallèle, la création d’un Design System adapté à cette nouvelle direction artistique aide les développeurs à s’approprier les règles graphiques de cette refonte.

Tytl s’adresse à une grande variété d’utilisateurs : professionnels, particuliers, agents… tous avec des besoins spécifiques.

Il y a aussi une dualité d’usage : d’un côté ceux qui découvrent Tytl et veulent se renseigner sur ses offres et ses avantages, de l’autre ceux qui l’utilisent déjà au quotidien. Séparer ces deux expériences utilisateurs, c’est ce qui ressort dans ce besoin de renouveau.

L’arborescence du site est retravaillée : une version non-connectée pour la découverte des offres, une version connectée pour l’action. Un menu et une interface avec des contenus plus commerciaux/marketing pour les nouveaux usagers afin qu’ils découvrent les fonctionnalités clés de la plateforme. L’utilisateur, en découverte, peut parcourir librement le site, comprendre la plus-value du service en explorant les différentes offres et même tester la plateforme et ses fonctionnalités, sans engagement.

En mode connecté, on ne se concentre que sur l’outil métier et l’ensemble de ses fonctionnalités afin de travailler efficacement, pleinement immergé dans l’univers de Tytl.

Cette dualité dans la nouvelle expérience que propose Tytl, c’est là toute sa force. Une plateforme capable d’offrir à chacun un parcours adapté, tout en rendant l’ensemble clair, fluide, et accessible.

La refonte d’Addland autour d’une logique produit vise à clarifier la navigation et à guider les visiteurs plus efficacement vers les contenus à forte valeur ajoutée, répondant à leurs besoins métier, pour les convertir en utilisateurs quotidiens.

Un travail exhaustif a été mené pour s’assurer que chaque page existante trouve un équivalent pertinent dans la nouvelle structure. Des choix de fusion ou de suppression ont été opérés avec précaution, en évaluant leurs impacts sur le référencement naturel (SEO) tout en éliminant les redondances et contenus obsolètes.

Cet enjeu business a arbitré la priorisation de la refonte. Certaines pages ne demandaient qu’une mise à jour esthétique, tandis que d’autres, plus stratégiques, ont nécessité un retravail UX plus en profondeur.

Côté découverte, l’effort a été mis sur la page d’accueil et les landing pages produit.

Côté action, l’effort s’est porté sur le passage en mode outil métier avec une attention particulière au dashboard de l’espace connecté et sur l’outil Tytl Insights.

Pour optimiser le temps de conception et garantir une cohérence visuelle et fonctionnelle, une logique de design systémique est adoptée, permettant la réutilisation de composants entre les différentes pages. Cette approche permet de concilier efficacité de production, expérience utilisateur améliorée et homogénéité de l’interface.

C’est l’occasion de reposer un Design System propre, de repenser la construction de ses composants, de les variabiliser et tellement plus ! Une refonte stimulante où la contrainte devient un moteur de création.

Remettre à plat un Design System, nous permet de repenser des petits éléments qui vont finalement avoir un impact plus global, ce qui permet cet équilibre subtil entre une refonte UI plus moderne et ce besoin de conserver la structure de nos anciens composants pour éviter d’avoir à refaire le site dans son entièreté.

Cette refonte c’est donc l’occasion de reconstruire un Design System solide et cohérent, repensé par une équipe bien plus expérimentée sur le sujet que quelques années auparavant. On y pose des bases solides qui nous permettent d’industrialiser notre fichier et de gagner du temps lors de la création. On travaille également sur le principe de « pages templates », qui nous permet de créer des pages industrialisables à la fois design et dynamiques, dans un temps restreint.

Le défi consiste aussi à adapter une toute nouvelle identité graphique à l’ensemble du site sans pour autant en changer ses fondations. Ici, nous voulons adapter le site à la nouvelle direction artistique et à la nouvelle image de Tytl, mais nous voulons également le faire sur les bases solides et ancrées du site déjà existant.

Comme partout, la homepage est clairement notre élément décisif. Il faut qu’en un coup d’œil, les éléments soient marquants, que les couleurs, les choix graphiques et le rebranding dans son ensemble apportent de la clarté à l’information. On veut pouvoir mettre en avant des fonctionnalités et des nouveautés qui, jusque-là, étaient un peu perdues dans l’immensité d’une plateforme qui a beaucoup à offrir.

Et évidemment, on veut que ce soit impactant.

Notre second point décisif, ce sont les univers. Distinguer clairement l’expérience entre l’utilisateur connecté et non connecté, le tout en gardant une cohérence visuelle.

Une distinction qui se fait principalement grâce à deux navigations bien distinctes. Une fois dans l’outil, la navigation se transforme en un panneau latéral, créant ainsi l’impression d’un véritable outil de travail et non plus d’un site classique. Cette distinction des modes de navigation, c’est l’un des atouts majeurs de ce renouveau, permettant à l’utilisateur de s’immerger pleinement dans la plateforme et dans l’utilisation de ses différentes fonctionnalités.

Un nouveau design ne se résume pas uniquement à de jolis carrés et à une meilleure lisibilité générale. Il passe aussi par des éléments parfois laissés de côté, comme les micro-animations et les illustrations.

Les illustrations permettent de donner de la cohérence à votre site et peuvent avoir un impact bien plus important qu’on ne le pense. C’est pour cela que nous avons choisi des illustrations modernes, colorées et simples. Fini les personnages dans lesquels on ne se reconnaît pas forcément ou que l’on a déjà vus une centaine de fois. Ici, nous mettons en avant les gestes et les objets, rendant ainsi ces illustrations presque intemporelles.

Il en est de même pour les micro-animations. Souvent délaissées, elles permettent d’apporter de la vie à un site web. Et c’est exactement ce que nous recherchions pour la refonte de Tytl. Sur un sujet aussi dense et sérieux, ces petites touches permettent de dynamiser la navigation et de rendre des pages monotones plus vivantes.

Une refonte de cette envergure, étalée sur plusieurs mois, nous permet d’aboutir à une plateforme claire, plus vivante et plus juste, mais également à une expérience fluide sur l’ensemble du parcours et pour tous les publics.

Même si un changement aussi radical pour une entreprise déjà bien installée peut comporter des risques, c’est surtout l’occasion de marquer les esprits avec un impact visuel fort.

Cette nouvelle direction artistique innovante, couplée à une nouvelle stratégie business, est un élément différenciant non négligeable sur le marché.

Finalement, ce sont plus d’une centaine de pages que nous avons eu la chance de retravailler, en UX et UI, sur une période de 8 mois. Un travail fastidieux mais gratifiant, qui nous a poussés à penser hors des cadres habituels.

Un travail qui est loin d’être terminé, puisque nous continuons d’accompagner Tytl chaque semaine dans le développement de leur plateforme. Une équipe dédiée se retrouve régulièrement pour compléter, améliorer et faire grandir une plateforme en constante évolution, qui est loin d’avoir stoppé sa croissance.