Design of Social Media
Ux & Ui design pour un moteur de recherche basé sur la confiance
TrustSearch est une plateforme de recherche basé sur la confiance. Par un algorithme basé sur la théorie des noeuds ; le fameux “nous sommes tous à 6 noeuds ou moins de Barack Obama” ; votre réseau et vos affinités, vous pouvez trouver des professionels qui vous correspondent.
Une fois théorisé, ils ont eu besoin de designer leurs plateformes avant de la développer. Après une phase de branding pour figer les couleurs et le style, on a pu démarrer les processus Ux (User experience) et Ui (User Interface). Les trois premières étapes sont Ux, le user flow ou flow utilisateur, qui est un diagramme qui va regrouper tout les besoins fonctionnels d’un utilisateur définit, va en découler le Sitemap, qui est l’inventaire page par page de votre site et enfin le wireframing, qui va être le design en “fil de fer” (sans éléments graphique/visuels) de vos pages. Une fois l’étape du wireframing finalisée, on peut démarrer la partie Ui. C’est le moment ou l’on va appliquer tout vos éléments graphiques sur les précédentes maquettes et intégrer les images, animations et illustrations.
Page de profil utilisateur sur TrustSearch. Ui : Design de la Home page – Intégration de la charte graphique
Cette image illustre la page de profil utilisateur sur TrustSearch. En haut, un résumé du profil met en avant le TrustScore, une biographie, et des vues récentes. Des graphiques interactifs suivent, montrant l’évolution de la fiabilité, la localisation des connexions et les tendances des interactions. En bas, des sections dédiées présentent des données sur les followers, les publications, et les performances des publications (vues, partages, commentaires). Les badges et récompenses sont affichés pour souligner les réalisations, et des profils similaires ou connexes sont proposés. Ce design offre une vue complète et interactive pour l’utilisateur, mettant en avant la transparence et la connectivité.
Résultats de recherche TrustSearch. Ui Design de la page de résultat de la recherche
Cette image représente l’interface de résultats de recherche sur la plateforme TrustSearch. Les profils sont classés par leur TrustScore, un indicateur de fiabilité basé sur plusieurs critères. Chaque résultat affiche un portrait ou un logo, une brève description, la localisation et une icône indiquant leur niveau de fiabilité. Sur la droite, des options de recherche associées et un outil de comparaison permettent une navigation simplifiée et des choix éclairés. Ce design met en avant la transparence et l’accessibilité des informations pour une meilleure expérience utilisateur.
Ux : Définitions du Sitemap. Sitemap TrustSearch #2
Cette sitemap illustre l’organisation de TrustSearch, mettant en avant les connexions entre les différentes pages du site. La page d’accueil agit comme point central, menant vers des sections comme les résultats de recherche, les profils d’utilisateurs, et les conditions générales. Des pop-ups spécifiques permettent l’inscription, la connexion, ou l’amélioration du TrustScore. Des pages comme “À propos”, “Mentions légales”, et “Conseils” complètent les options pour offrir une navigation claire et orientée utilisateur. Ce plan est conçu pour maximiser l’efficacité de l’expérience utilisateur grâce à une structure cohérente et intuitive.
Interface utilisateur Valire – Aperçu des fonctionnalités. Responsive design, adaptation des écrans aux téléphones
Cette série d’images représente une vue d’ensemble des principales fonctionnalités de Valire. Elle comprend des pages interactives avec des graphiques détaillés sur les performances, des publications liées à des images, des avis clients notés par étoiles, et des outils pour gérer les ambassadeurs et les revendeurs de confiance. L’interface est visuellement structurée pour offrir une navigation intuitive et une analyse claire des données. Ces captures mettent en avant le potentiel de Valire pour connecter utilisateurs et experts dans un écosystème de confiance.
Ux : Définition du flow utilisateur. Flux utilisateur TrustSearch
Ce diagramme de flux utilisateur présente le parcours dans l’écosystème TrustSearch. Les étapes incluent l’accès via un navigateur, l’inscription et la personnalisation de profil, jusqu’aux filtres de recherche et suggestions de résultats. Les formes géométriques comme des losanges (pour les décisions), rectangles (pour les actions) et cercles (pour les étapes-clés) indiquent clairement chaque phase. Ce flux met en évidence une interface intuitive, favorisant une navigation fluide et des résultats pertinents pour l’utilisateur final.
Tableau de bord Valire – Vue utilisateur complète. Ui design de la page profil
Cette capture d’écran présente le tableau de bord utilisateur de Valire. En haut, on retrouve les informations de profil, telles que le score de confiance (T-Score) et les réseaux sociaux connectés. Sur le côté droit, des évaluations clients et des graphiques d’évolution permettent de suivre les performances et les interactions. La section centrale met en avant les connexions de confiance et les publications associées, illustrant des contenus visuels comme des images et des avis. Les données graphiques en bas détaillent le nombre de followers et leur engagement au fil du temps. Ce tableau de bord est conçu pour offrir une vue complète et interactive pour les utilisateurs souhaitant gérer leur présence et leur réputation en ligne.
Aperçu des pages et flux TrustSearch. Partie Ui design après la phase Ux
Cette image illustre le parcours utilisateur et les différentes interfaces du site TrustSearch. À gauche, les pages de résultats montrent des profils listés avec des informations clés. Au centre, les pages de profils offrent un aperçu détaillé des activités, connexions et statistiques des utilisateurs. Les étapes de connexion et d’inscription sont représentées en bas, avec des interfaces simplifiées pour une expérience utilisateur fluide. Enfin, une vue globale des blocs et éléments du site met en évidence la cohérence visuelle et fonctionnelle du design. Cette maquette reflète une navigation claire et intuitive pour maximiser l’engagement utilisateur.
