Chaque semaine, nous examinons un nouveau site Web et en analysons le design. Nous soulignerons les deux domaines qui sont bien faits en plus de ceux qui pourraient nécessiter du travail. Enfin, nous terminerons en vous demandant de fournir vos propres commentaires.
Aujourd'hui, nous avons un client génial que je suis sûr que nous aimons tous: SeaWorld! À quel point cela est cool? Faisons un saut et voyons ce que nous pensons de leur site.
Si vous souhaitez soumettre votre site Web pour qu'il soit présenté dans une future Critique de conception, cela ne prend que quelques minutes. Nous facturons 49 $ pour la critique de votre conception - bien moins que le coût d'un consultant pour consulter votre site! Vous pouvez en savoir plus ici.
À propos de SeaWorld
SeaWorld n'a pas besoin d'introduction. C'est l'une des chaînes de parcs à thème les plus cool qui soient. Les dauphins, les épaulards, les mantas et bien d’autres se mêlent à des manèges à sensations fortes et à d’autres grandes attractions. C'est simplement un endroit magique.
Bien entendu, les gens de Sea World savent tout ce qu'il faut savoir pour offrir aux visiteurs une expérience de parc thématique imbattable, mais comment se porte leur Web UX? Nous allons jeter un coup d'oeil.
Voici une capture d'écran de la page d'accueil de SeaWorld Parks:
La page de lancement
La page ci-dessus est simplement une passerelle qui vous conduit à l’un des trois emplacements SeaWorld: San Diego, San Antonio ou Orlando. Nous allons creuser un peu plus tard le site d'un parc spécifique, mais commençons par une discussion sur cette page.
Quels sont les objectifs?
Étant donné que cette page est si simple, il est assez facile d'analyser son efficacité. Un rapide coup d’œil nous indique que les concepteurs cherchent à réaliser trois choses principales avec cette page. Le premier et le plus important objectif est de vous rendre sur l’un des sites dédiés aux parcs SeaWorld. Sans cet objectif, cette page n'existerait même pas, je dirais donc que c'est le but principal.
L'objectif premier et le plus important est de vous rendre sur l'un des sites dédiés aux parcs SeaWorld. Sans cet objectif, cette page n'existerait même pas.La communication de la marque est au cœur de cet objectif. Oui, vous êtes au bon endroit. Nous sommes SeaWorld et voici un aperçu de ce que vous pouvez vous attendre à voir dans nos parcs. La dernière partie du but réside dans la petite navigation secondaire en haut de la page. Juste au cas où vous seriez au mauvais endroit, voici quelques liens pour vous amener là où vous devez être.
Où est le focus?
Avec les objectifs ci-dessus à l’esprit, évaluons le succès de cette conception. Si le but de la page est uniquement de servir de passerelle vers les trois autres parcs, il va sans dire qu'une bonne partie de la page devrait être consacrée à cette tâche. Cependant, ce que nous voyons à la place, c’est qu’une partie assez minuscule de la page est dédiée à tout type d’interaction.
Commençons par le fil d’arrière afin d’évaluer les relations spatiales des éléments:
Comme vous pouvez le constater, toute l’interactivité est projetée dans une petite zone en haut de la page. Tout cela prend un peu de recul par rapport à la grande photo de l'Atlantis, dont nous parlerons plus tard. C’est bien de montrer un tour et d’enthousiasmer les gens, mais comme je l’ai mentionné ci-dessus, je crois que c’est l’objectif secondaire de la page. Dans sa forme actuelle, il s’agit plutôt d’une distraction.
Lorsque j'arrive sur cette page, ce graphique me tire immédiatement dessus, mais ne me mène nulle part. Ce n'est pas un lien, cela ne pointe vers rien, c'est juste une image. A partir de là, mes yeux n'ont pas d'instinct de destination. Ils sont obligés de parcourir la page pour savoir ce qui se passe.
«S'il ne s'agit vraiment que d'une page de transition, vous devez amener les utilisateurs là où ils le souhaitent, le plus rapidement possible.Je vous propose de repenser l'ensemble du flux de communication sur cette page. S'il ne s'agit vraiment que d'une page de transition, vous devez amener les utilisateurs là où ils veulent aller le plus rapidement possible. Les chances sont, vous avez seulement une minute de leur temps pour commencer et vous venez de perdre du temps en les forçant à comprendre cette page. Imaginez que nous avons déplacé la page vers quelque chose de plus semblable à ceci:
Cela met l'objectif principal de la page à l'avant et dans votre visage. Ici, les trois choix de parcs à thème occupent une place centrale. Dès que la page est chargée, vous comprenez ce qui se passe et cliquez sur le parc que vous souhaitez visiter.
L'objectif de cette présentation est de réduire le temps passé sur la page de passerelle afin que l'utilisateur puisse être plus productif. Les trois grandes boîtes servent deux fois. Ils obtiennent les utilisateurs où ils veulent aller et vous donnent un bel espace pour les images de marque. Plutôt que de présenter une attraction sur cette page, vous pouvez mettre en évidence trois caractéristiques uniques, une de chaque site.
Esthétique
La sensation esthétique de la page est un paysage océanique avec une vie aquatique et votre stéréotype de famille nucléaire américaine s’amusant. Conceptuellement, cela touche tous les points importants. C'est humide, sauvage, amusant et cible ce qui est probablement la principale clientèle de SeaWorld (familles bien habillées, de la classe moyenne supérieure avec un revenu disponible).
Parfois, quelque chose peut être conceptuellement irréalisable, mais son exécution n’est pas excellente, et je pense que c’est ce qui se passe ici. Les graphiques sur la page ont tous une sorte de look pavé de Photoshop.
«Parfois, quelque chose peut être conceptuellement irréalisable, mais son exécution n’est pas excellente, et je pense que c’est ce qui se passe ici.Les éclaboussures, par exemple, sont visiblement tirées d’une prise de vue à petite échelle. Il est probable que les éclaboussures proviennent d'une photo en stock de quelque chose comme un fruit qui tombe dans de l'eau. Cela a pour effet étrange de faire paraître les gens presque en miniature. Ajoutez le fond à la composition et soudainement, tout semble trop gros. L'échelle de tout ici est juste un peu wachée.
Les chances sont, la plupart des gens ne remarqueront pas toutes ces choses.Cela dit, j'estime que la qualité de l'expérience visuelle est plutôt faible. Connaissant le fonctionnement des équipes de conception, il ne fait aucun doute que ce sont simplement les ressources de marque avec lesquelles l’équipe de conception Web a dû travailler. Personnellement, je pense qu’un grand, de haute qualité, réal Une photo de personnes s’amusant sur le trajet aurait un impact plus grand, plus crédible.
Parc Page d'accueil
Nous avons passé beaucoup de temps à critiquer une très petite partie du site, mais comme il s'agit de la première chose que les gens voient, il vaut la peine de prendre le temps de bien faire les choses. Maintenant, avançons et examinons l'un des sites de parc dédiés.
Première impression
Ici nous avons une page avec beaucoup plus de choses en cours. La partie centrale n'est plus une image statique, c'est un diaporama qui passe en revue diverses attractions passionnantes avec beaucoup de sourires, de familles heureuses et de créatures nageuses. Pour être honnête, beaucoup des problèmes esthétiques que nous avons vus auparavant sont reportés ici.
Je ne suis pas très impressionné par l'apparence du site dans son ensemble. La marque? SeaWorld? se détache comme un peu encombré et occupé. Les images sont un patchwork d’idées diverses, toutes giflées ensemble et intégrées maladroitement au fond de l’océan. Ils sont également tous présentés à une très basse résolution avec des tonnes d'artefacts JPG laids.
«Les images sont un patchwork d’idées diverses, toutes giflées ensemble et intégrées maladroitement au fond de l’océan.Si l’arrière-plan est ce qui a motivé l’équipe de conception, perdez-le. Vous pouvez utiliser une photo pleine largeur dans l'en-tête sans que celle-ci occupe tout l'arrière-plan du site. Je pense que le site ci-dessous le fait très bien:
Ce site est magnifique et nous pouvons en apprendre beaucoup. Notez que les images sont composées de photographies de très haute qualité et non de compilations Photoshop rapides et sales. Il se passe beaucoup de choses, mais tout est bien organisé et simplifié pour ne pas crier trop pour attirer votre attention à la fois.
Les images sont-elles toutes fausses pour SeaWorld? Bien sûr. Ils ont encore besoin de poursuivre les clichés familiaux passionnants pleins d'action, mais cela devrait être fait d'une manière qui ressemble plus au site ci-dessus. Donnez-moi du plaisir, mais ne sacrifiez pas la qualité de l'expérience visuelle pour y arriver.
"Donnez-moi du plaisir, mais ne sacrifiez pas la qualité de l'expérience visuelle pour y arriver."Je ne peux pas imaginer que SeaWorld, de tous les endroits, ne possède pas une pile d'images renversantes de la bête et de l'homme, n'attendant que d'être intégrée à un site magnifique.
Quels sont les objectifs?
Les objectifs de cette page sont beaucoup plus compliqués que la page que nous avons vue auparavant. Pour commencer, voyons pourquoi, en tant qu’utilisateur, je visiterais le site SeaWorld. Voici une liste de choses que j'ai suggérées, sans ordre particulier:
- Education: A quoi ressemble SeaWorld? Qu'allons nous faire?
- Achat de billets
- Planifier mon voyage (hôtels, vols, etc.)
- Heures de parc
- Directions routières
- Ventes et événements spéciaux
Performance par rapport aux objectifs
Pour l’essentiel, le site fonctionne assez bien par rapport à ma brève liste d’objectifs possibles. J'aime le fait que ce petit widget soit l'une des premières choses que je vois sur le site:
C'est génial. Tout de suite, je peux voir les heures du parc et les conditions météorologiques. Ce sont deux grandes raisons pour les visites sur site et sans un seul clic, j'ai déjà trouvé ma réponse.
Explorer plus loin, il y a une jolie petite zone d’achat de billets, les directions sont à portée de clic sous la rubrique «Infos parc». lien, il existe plusieurs liens de planification de voyage et des tonnes d’informations sur le parc et ce qui se passe.
Globalement, je pense que si je vis un objectif spécifique lorsque je viens sur le site, je devrais être capable de le réaliser assez facilement. Inversement, si je cherche seulement à explorer, il y a beaucoup de contenu pour me passionner pour le parc.
Menus de navigation
Bien que ce ne soit pas trop difficile pour moi de trouver ce que je cherche, je pense toujours qu'il y a encore beaucoup à faire. La principale chose qui me fait secouer la tête est actuellement le menu de navigation? ou plutôt des menus.
Il y a au moins quatre lignes horizontales différentes de liens dans ce petit espace. En outre, il existe d’énormes menus déroulants en survol. Nous avons des sous-menus pour nos sous-menus. Les concepteurs diffèrent toujours sur le point de savoir s'il est bon d'avoir une tonne de navigation qui rend chaque page accessible en un clic de la page d'accueil. Il existe évidemment des avantages et des inconvénients aux méga-tactiques de navigation, mais une chose est sûre: elles sont faciles à gâcher.
Indépendamment du moment où vous voulez aller, je pense qu’une simplification est essentielle. Il y a juste trop de navigation et il est très difficile de passer au crible. Ce problème est extrêmement courant sur les grands sites contenant beaucoup de contenu et la réponse n’est pas toujours facile. Ci-dessous, vous pouvez voir que Disney lutte avec la même surcharge de navigation.
Pensées de clôture
Il est facile de prendre du recul et de juger les grandes organisations de leurs problèmes de conception. L'argument est toujours le même: ils ont tant d'argent et de ressources, pourquoi ne peuvent-ils pas créer le meilleur site Web au monde?
La réalité de la situation est qu’il s’agit d’une position assez naïve adoptée par ceux qui n’ont jamais travaillé au sein d’une grande organisation. Vous pouvez voir le pigiste travailler sur son propre site personnel en tant qu’opprimé, mais en réalité, il a l’avantage du point de vue de la conception. Il peut faire tout ce qu'il veut. Utilisez des technologies Web expérimentales, supervisez l'intégralité de la conception et assurez-vous d'une expérience cohérente et de premier ordre. tout cela sort de sa tête et il n'y a personne pour le contester.
"Ils travaillent dur et ont une bonne signification, mais au final, il y a beaucoup d'obstacles majeurs entre eux et une conception stellaire."Comparez cela à la façon dont les projets de conception de sites Web d'entreprise vont généralement. Il y a beaucoup de mains et de têtes qui doivent collaborer sur un seul projet. Les directives de marque strictes et souvent concurrentes, les exigences de compatibilité de navigateur, les ressources de conception médiocres (ordures inopinées, ordures), les longues réunions et la politique de bureau sont ce qui définit le quotidien de ces personnes. Ils travaillent fort et ont de bonnes intentions, mais à la fin, il y a beaucoup d'obstacles majeurs entre eux et un design stellaire.
Recommandations pour l'avenir
Il y a beaucoup d'améliorations progressives à apporter ici, mais réfléchissons à la refonte majeure qui se produira inévitablement un jour. Même si c'est dans les années à venir, cela vaut la peine de discuter.
Ma recommandation est de tout démolir et de recommencer à zéro. Deux grands changements doivent se produire. Tout d'abord, l'équipe de marque SeaWorld doit décider de son apparence sur le Web. L'esthétique actuelle ne le coupe pas et ils ont besoin d'une nouvelle direction qui affiche un meilleur équilibre entre des images passionnantes et de grande qualité.
"Les développeurs Web doivent créer des structures filaires et se concentrer sur la convivialité en dehors de l'esthétique."Pendant ce temps, les développeurs Web doivent créer des structures filaires et se concentrer sur la convivialité en dehors de l’esthétique. Le nom du jeu est simplification. Réduisez le fouillis et déterminez ce qui est le plus important. Comme nous l'avons vu sur la page de la passerelle, les éléments importants doivent être plus visibles et plus faciles à utiliser. Étudiez le flux simple du site de l'île Kiawah ci-dessus et prenez des notes. Trouvez d'autres sites qui constitueront d'excellentes sources d'inspiration et déterminez ce qu'ils font bien.
Pendant que vous y êtes, faites du mobile une priorité. Je n'avais ni le temps ni l'espace ici pour couvrir le site mobile, mais c'est mauvais. Le site suivant doit être réactif et ne pas pénaliser les utilisateurs mobiles ayant une expérience médiocre.
• Le site suivant doit être réactif et ne pas pénaliser les utilisateurs mobiles ayant une expérience médiocre. ?Le projet de refonte constituera un défi énorme, difficile et frustrant, qui saute trop facilement au vif du sujet et se transforme en désastre. Telle est la situation critique du concepteur de sites Web. Nous aimons tous cela parce que malgré tous les défis, des résultats étonnants peuvent en fait être atteints. Je suis convaincu que l’équipe SeaWorld a le talent d’obtenir un design superbe et très utilisable si elle se consacre réellement à ces deux objectifs.
À ton tour!
Maintenant que vous avez lu mes commentaires, apportez votre contribution en donnant quelques conseils supplémentaires au concepteur. Dites-nous ce que vous pensez être génial à propos de la conception et ce que vous pensez pourrait être plus fort. Comme toujours, nous vous demandons d'être également respectueux du concepteur du site et d'offrir des conseils clairs et constructifs, sans aucune insulte dure.