Cada semana echamos un vistazo a un nuevo sitio web y analizamos el diseño. Señalaremos las áreas que se realizan bien además de las que podrían ser útiles. Finalmente, terminaremos pidiéndole que proporcione sus propios comentarios.
Hoy tenemos un cliente increíble que estoy seguro de que todos amamos: ¡SeaWorld! ¿Cuan genial es eso? Vamos a saltar y ver qué pensamos de su sitio.
Si desea enviar su sitio web para que aparezca en una futura crítica de diseño, solo le llevará unos minutos. Cobramos $ 49 por criticar su diseño, ¡mucho menos de lo que pagaría por un consultor para que visite su sitio! Puedes encontrar mas aqui.
Acerca de SeaWorld
SeaWorld no necesita presentación. Es una de las mejores cadenas de parques temáticos en existencia. Delfines, ballenas asesinas, mantas y más entremezclados con atracciones y otras grandes atracciones. Es simplemente un lugar mágico.
Obviamente, la gente de Sea World sabe todo lo que hay que saber sobre brindar a las personas una experiencia de parque temático inigualable, pero ¿cómo es su experiencia de usuario en la web? Vamos a ver.
Aquí hay una captura de pantalla de la página de inicio de SeaWorld Parks:
La página de inicio
La página que se muestra arriba es simplemente una puerta de enlace que lo lleva a una de las tres ubicaciones de SeaWorld: San Diego, San Antonio u Orlando. Profundizaremos en el sitio de un parque específico un poco más tarde, pero comencemos con una discusión en esta página.
¿Cuáles son los objetivos?
Dado que esta página es tan simple, es bastante fácil analizar su efectividad. Una mirada rápida nos dice que hay tres cosas principales que los diseñadores buscan lograr con esta página. El primer y más importante objetivo es llevarlo a uno de los sitios dedicados del parque SeaWorld. Sin este objetivo, esta página ni siquiera existiría, así que llamaría a eso el propósito principal.
? El primer y más importante objetivo es llevarlo a uno de los sitios dedicados del parque SeaWorld. Sin este objetivo, esta página ni siquiera existiría.De la mano con ese propósito está la comunicación de marca. Sí, has venido al lugar correcto. Somos SeaWorld y aquí hay una pequeña muestra de lo que puede esperar ver en nuestros parques. El último objetivo está en la pequeña navegación secundaria en la parte superior de la página. En caso de que haya venido al lugar equivocado, aquí hay algunos enlaces para llegar a donde necesita estar.
¿Dónde está el enfoque?
Con los objetivos anteriores en mente, evaluemos el éxito de este diseño. Si todo el propósito de la existencia de la página es servir como una puerta de entrada a los otros tres parques, entonces es lógico pensar que una buena parte de la página debe estar dedicada a esta tarea. Sin embargo, lo que vemos en cambio es que una parte bastante minúscula de la página está dedicada a cualquier tipo de interacción.
Hagámoslo de manera que podamos evaluar las relaciones espaciales de los elementos:
Como puede ver, toda la interactividad se produce en un área pequeña en la parte superior de la página. Todo toma un asiento trasero en el gran tiro de Atlantis, que veremos más adelante. Es genial lucir un paseo y hacer que la gente se emocione, pero como mencioné anteriormente, creo que este es el objetivo secundario de la página. En su forma actual, en realidad es más una distracción.
Cuando llego a esta página, ese gráfico me atrae de inmediato, pero no me lleva a ningún lado. No es un enlace, no apunta a nada, es solo una imagen. A partir de ahí, mis ojos no tienen instintivamente un próximo destino. Se ven obligados a flotar alrededor de la página para averiguar qué diablos está pasando.
"Si esto realmente es solo una página de transición, entonces necesita que los usuarios se dirijan a donde quieran ir lo más rápido posible".Le propongo que repiense todo el flujo de comunicación en esta página. Si esto realmente es solo una página de transición, entonces necesita que los usuarios adonde quieran ir tan rápido como sea posible. Lo más probable es que solo tengas un minuto de su tiempo para empezar y que hayas perdido el tiempo obligándolos a descubrir esta página. Imagina que cambiamos la página a algo más como esto:
Esto pone el objetivo principal de la página en la parte frontal y en su cara. Aquí, las tres opciones de parques temáticos toman el centro del escenario Tan pronto como se carga la página, comprende lo que está sucediendo y hace clic en el parque que le interesa visitar.
El objetivo de este diseño es reducir la cantidad de tiempo empleado en la página de la puerta de enlace para que los usuarios puedan ser más productivos. Las tres cajas grandes sirven doble función. Consiguen a los usuarios a donde quieren ir y te dan un espacio agradable para las imágenes de la marca. En lugar de mostrar una atracción en esta página, puede resaltar tres características únicas, una de cada sitio.
Estética
La sensación estética de la página es un paisaje oceánico con algo de vida acuática y su estereotipada familia nuclear estadounidense se divierte en un viaje. Conceptualmente, esto golpea todos los puntos importantes. Es húmedo, salvaje, divertido y apunta a lo que probablemente sea la base de clientes primaria de SeaWorld (familias bien vestidas, de clase media alta con ingresos disponibles).
A veces, algo puede ser conceptualmente muerto, pero al final no es tan bueno en la ejecución, y creo que eso es lo que está sucediendo aquí. Todos los gráficos en la página tienen una especie de aspecto de trabajo de hacha de Photoshop improvisado.
"A veces, algo puede ser conceptualmente muerto, pero al final no es tan bueno en la ejecución, y creo que eso es lo que está sucediendo aquí".La salpicadura, por ejemplo, obviamente se extrae de un disparo a pequeña escala. Es probable que la salpicadura sea de una foto de stock de algo como una fruta que se cae en un poco de agua. Esto tiene el extraño efecto de hacer que las personas parezcan casi en miniatura. Tira el fondo en la mezcla y, de repente, todo parece demasiado grande. La escala de todo aquí es un poco torpe.
Las probabilidades son que la mayoría de la gente no notará todas estas cosas.Dicho esto, creo que la calidad de la experiencia visual aquí es bastante baja. Sabiendo cómo funcionan los equipos de diseño, estos son sin duda simplemente los recursos de marca con los que tuvo que trabajar el equipo de diseño web. Personalmente creo que uno grande, de alta calidad, real La foto de personas que se divierten en el viaje tendría un impacto mayor y más creíble.
Página de inicio del parque
Pasamos mucho tiempo criticando una pequeña parte del sitio, pero dado que es lo primero que ve la gente, vale la pena tomarse el tiempo para hacerlo bien. Ahora avancemos y veamos uno de los sitios dedicados al parque.
Primera impresión
Aquí tenemos una página con mucho más en marcha. La parte central ya no es una imagen estática, es una presentación de diapositivas que recorre varias atracciones emocionantes con muchas familias felices y sonrientes y criaturas nadadoras. Para ser honesto, muchos de los problemas estéticos que vimos antes se transmiten aquí.
No estoy muy impresionado con la apariencia del sitio como un todo. ¿La marca SeaWorld? Está saliendo como un poco abarrotado y ocupado. Las imágenes son un mosaico de varias ideas, todas abofeteadas e incómodamente integradas en el fondo del océano. También están todos presentados en una resolución realmente baja con toneladas de artefactos JPG feos.
"Las imágenes son un mosaico de varias ideas, todas juntas e incómodamente integradas en el fondo del océano".Si el fondo es lo que hace tropezar al equipo de diseño, pierdelo. Puede usar una foto de ancho completo en el encabezado sin que ocupe todo el fondo del sitio. Creo que el siguiente sitio, hace esto bastante bien:
Este sitio es precioso y hay mucho que podemos aprender de él. Observe cómo las imágenes se componen de fotografías de alta calidad, no de compilaciones rápidas y sucias de Photoshop. Están pasando muchas cosas, pero todo está muy bien organizado y simplificado para que no grites demasiado para llamar tu atención al mismo tiempo.
Ahora, ¿están las imágenes mal para SeaWorld? Por supuesto. Todavía necesitan seguir las emocionantes tomas familiares llenas de acción, pero deben hacerse de una manera que se parezca más al sitio anterior. Dame diversión, pero no sacrifiques la calidad de la experiencia visual para llegar allí.
"Dame diversión, pero no sacrifiques la calidad de la experiencia visual para llegar allí".No puedo imaginar que SeaWorld de todos los lugares no tenga un montón de imágenes impresionantes tanto de bestias como de hombres, esperando a que se integre en un sitio hermoso.
¿Cuáles son los objetivos?
Los objetivos para esta página son mucho más complicados que la página que vimos antes. Para comenzar, consideremos por qué yo, como usuario, visitaría el sitio de SeaWorld. Aquí hay una lista de cosas que se me ocurrieron, sin ningún orden en particular:
- Educación: ¿Cómo es SeaWorld? ¿Que haremos?
- Comprar entradas
- Planifico mi viaje (hoteles, vuelos, etc.)
- Horas de parque
- Indicaciones de viaje
- Ventas y Eventos Especiales
Rendimiento contra goles
En su mayor parte, el sitio funciona bastante bien en comparación con mi breve lista de posibles objetivos. Me encanta que una de las primeras cosas que veo en el sitio es este pequeño widget:
Esto es impresionante De inmediato puedo ver las horas del parque y las condiciones climáticas. Estas son dos grandes razones para las visitas al sitio y sin un solo clic ya encontré mi respuesta.
Para seguir explorando, hay una pequeña y agradable área de compra de boletos, las instrucciones de manejo están a un clic de distancia debajo de "Información del parque". enlace, hay varios enlaces de planificación de viajes y toneladas de educación sobre cómo es el parque y qué está sucediendo.
En general, creo que si tengo un objetivo específico en mente cuando llego al sitio, debería poder lograrlo con bastante facilidad. A la inversa, si solo estoy buscando explorar, hay mucho contenido para entusiasmarme con el parque.
Menús de navegación
A pesar de que no es demasiado difícil para mí encontrar lo que busco, todavía creo que hay mucho margen de mejora. ¿Lo principal que me hace sacudir la cabeza actualmente es el menú de navegación? o más bien menús.
Hay al menos cuatro líneas horizontales diferentes de enlaces en este pequeño espacio. Además, hay enormes menús desplegables en el hover. Tenemos submenús para nuestros submenús. Los diseñadores siempre difieren en si es bueno o no tener toneladas de navegación que hace que cada página esté a un clic de distancia de la página de inicio. Obviamente, hay tácticas de mega navegación tanto a favor como en contra, pero una cosa es segura: son fáciles de arruinar.
Independientemente de lo lejos que quiera llevarlo, creo que una simplificación aquí es vital. Simplemente hay demasiada navegación y hace que sea muy difícil filtrarlo. Este problema es extremadamente común en sitios grandes con mucho contenido y no siempre hay una respuesta fácil. Abajo puedes ver que Disney lucha con la misma sobrecarga de navegación.
Pensamientos de cierre
Es fácil retroceder y juzgar a las grandes organizaciones por sus problemas de diseño. El argumento siempre es el mismo: tienen tanto dinero y tantos recursos, ¿por qué no pueden sacar el mejor sitio web del mundo?
La realidad de la situación es que esta es una posición bastante ingenua que solo adoptan quienes nunca han trabajado como parte de una organización grande. Puede ver al freelancer trabajando en su propio sitio personal como el más débil, pero en realidad, tiene la ventaja desde la perspectiva del diseño. Él puede hacer lo que quiera. Use tecnologías web experimentales, supervise todo el diseño y asegúrese de que haya una experiencia consistente y de primer nivel; todo sale de su cabeza y no hay nadie para desafiarlo.
"Trabajan duro y tienen buenas intenciones, pero al final, hay muchos obstáculos importantes entre ellos y un diseño estelar".Contrasta esto con la forma en que suelen ir los proyectos de diseño web corporativo. Hay muchas manos y cabezas que tienen que colaborar en un solo proyecto. Las pautas de marca estrictas ya menudo competidoras, los requisitos de compatibilidad del navegador, los recursos de diseño por debajo del par (basura, basura), las reuniones largas y la política de oficina son lo que define la rutina diaria de estas personas. Trabajan duro y tienen buenas intenciones, pero al final, hay muchos obstáculos importantes entre ellos y un diseño estelar.
Recomendaciones para el futuro
Aquí se puede hacer una gran cantidad de mejoras incrementales, pero pensemos en el gran rediseño que inevitablemente sucederá algún día. Incluso si son años en el futuro, vale la pena discutirlo.
Mi recomendación es derribar todo y comenzar desde cero. Dos grandes cambios deben suceder. Primero, el equipo de la marca SeaWorld necesita decidir cómo quieren verse en la web. La estética actual simplemente no lo está cortando y necesitan una nueva dirección que muestre un mejor equilibrio entre imágenes que sea emocionante y de alta calidad.
"Los chicos de la red necesitan construir algunos wireframes y centrarse en la usabilidad, aparte de la estética".Mientras eso sucede, los chicos de la red necesitan construir algunos esquemas de conexión y enfocarse en la usabilidad, aparte de la estética. El nombre del juego es simplificación. Corta el desorden y descubre qué es lo más importante. Como vimos en la página de la pasarela, las piezas importantes deben hacerse más prominentes y fáciles de usar. Estudie el flujo simple del sitio de Kiawah Island arriba y tome notas. Encuentre otros sitios que funcionarán como grandes fuentes de inspiración y descubra qué están haciendo bien.
Mientras estás en eso, haz del móvil una prioridad. No tuve el tiempo o el espacio aquí para cubrir el sitio móvil, pero es malo. El siguiente sitio debe ser receptivo y no penalizar a los usuarios móviles con una experiencia mediocre.
? El siguiente sitio debe ser receptivo y no penalizar a los usuarios móviles con una experiencia mediocre. ?El proyecto de rediseño será un desafío enorme, difícil y frustrante que salta de la pista con demasiada facilidad y se convierte en un desastre. Tal es la difícil situación del diseñador web. A todos nos encanta porque a pesar de todos los desafíos, se pueden alcanzar resultados sorprendentes. Estoy seguro de que el equipo de SeaWorld tiene el talento para lograr un diseño sorprendente y altamente utilizable si realmente se dedican a esos dos objetivos.
¡Tu turno!
Ahora que ha leído mis comentarios, contribuya y ayude, dando al diseñador algunos consejos adicionales. Háganos saber lo que cree que es genial sobre el diseño y lo que cree que podría ser más fuerte. Como siempre, le pedimos que también sea respetuoso con el diseñador del sitio y que ofrezca consejos constructivos claros y sin insultos severos.