Viajando a mi universo...David Langarica © 2026

0
Proyectos / My Geek Advisor

My Geek Advisor

Diseño Web, Desarrollo Web

Visitar sitio web
My Geek Advisor — web design and development project by David Langarica
Rol
Diseñador UX/UI, Desarrollador Full-Stack
Responsabilidades
Diseño UX/UI, desarrollo front-end, integración con Stripe y Calendly, interacciones con GSAP, assets personalizados, SEO técnico
Tecnologías
Astro, Tailwind CSS, GSAP, Stripe API, Calendly API, Custom Assets
My Geek Advisor — web design and development project by David Langarica

Un sitio web a medida para un servicio de asesoría tecnológica construido alrededor de confianza, claridad y reservas pagadas.

My Geek Advisor es un servicio de asesoría tecnológica que ayuda a las personas a elegir los dispositivos, accesorios, software y setups adecuados antes de invertir dinero. El proyecto no fue solo un rediseño web. Fue una experiencia digital a medida pensada para convertir la confusión de compra en un recorrido claro: entender el servicio, elegir el plan adecuado, pagar de forma segura y reservar una consulta.

El cliente ya tenía un sitio en Wix, un logo y una oferta de servicios definida. Lo que faltaba era una experiencia digital que se sintiera específica para la marca y lo suficientemente sólida como para sostener un modelo de consultas pagadas.

Desde el inicio, el reto fue tan estratégico como visual. My Geek Advisor necesitaba transmitir confianza para que los usuarios pagaran y reservaran, pero sin perder la personalidad de la marca. El logo existente marcaba ese equilibrio: formal para consultoría tecnológica, pero también juguetón, cercano y memorable.

Partir de la necesidad real del negocio

El servicio ya era claro: ayudar a las personas a tomar mejores decisiones de compra tecnológica mediante asesoría personalizada. Los planes cubrían distintos tipos de usuario, desde estudiantes y usuarios domésticos hasta creadores, gamers, streamers, podcasters y personas planeando una PC personalizada.

Eso significaba que el sitio tenía que hacer más que describir consultoría. Necesitaba ayudar a los visitantes a reconocerse rápido, entender qué plan encajaba con su situación y avanzar del interés al pago sin pasos innecesarios.

Branding Brief

La decisión de diseño que definió la experiencia

La mayoría de los sitios de servicios usan un modelo de explorar primero y reservar después. Para My Geek Advisor, diseñamos alrededor de un flujo de pago primero: entender la oferta, elegir un plan, completar el pago con Stripe y después agendar en Calendly.

Homepage

Dirección visual: creíble, juguetona y personal

La dirección visual nació de interpretar la marca, no de imponer una estética tecnológica genérica. El logo ya sugería una mezcla entre estructura y personalidad, así que la interfaz se apoyó en un lenguaje visual suave, cercano al neomorfismo, con líneas marcadas, colores energéticos y assets personalizados.

Ese equilibrio era importante. El pago por adelantado requiere confianza, pero el servicio en sí es personal y de acompañamiento. El diseño tenía que sentirse confiable, claro y ordenado, sin perder el carácter necesario para que My Geek Advisor se percibiera como una guía real.

My Geek Advisor Sections

Hacer tangible el servicio

Una de las ideas de interacción más importantes fue una mesa de productos con drag-and-drop. En lugar de solo explicar que el asesor ayuda a elegir los productos correctos, la interacción convertía esa idea en una metáfora visual: ordenar herramientas, dispositivos y piezas de setup según las necesidades del usuario.

El objetivo no era agregar movimiento por decoración. Era hacer más fácil de entender el valor de la asesoría y hacer que el usuario entrara en la experiencia antes de pedirle que eligiera un plan.

Por qué Astro

El build final no necesitaba la carga de una aplicación completa. Necesitaba un sitio rápido, pulido y basado en contenido, con suficiente control front-end para soportar micro-interacciones, SEO técnico, layouts responsivos y un flujo fluido entre pago y reserva.

Astro mantuvo el sitio ligero sin limitar una implementación personalizada con Tailwind CSS, interacciones en GSAP, assets a medida, Stripe y Calendly.

Resultados

El sitio se lanzó como una experiencia web personalizada y responsiva, con un recorrido más claro desde el descubrimiento del servicio hasta la consulta pagada. En páginas clave, las puntuaciones de Lighthouse reflejaron las prioridades técnicas del build:

  • Rendimiento: 92-97

  • Accesibilidad: 95-100

  • SEO técnico: 100

Colaboración

La colaboración con el cliente fue directa y productiva. Yo proponía ideas visuales e interactivas, y él respondía con feedback basado en cómo entendía su propia marca. Esa dinámica ayudó a que el proyecto no se sintiera como una plantilla genérica y empujó el resultado hacia algo más específico: claro, práctico y con personalidad.

También tomamos una decisión intencional de no sobresaturar el sitio con información innecesaria. El servicio necesitaba claridad más que volumen. Cada sección tenía que ayudar al usuario a entender la oferta, comparar planes, confiar en el asesor y avanzar al siguiente paso.

Reflexión

La lección más fuerte de este proyecto fue que un sitio enfocado en conversión no tiene que sentirse frío ni genérico. Para My Geek Advisor, las mejores decisiones salieron de combinar claridad con personalidad: un flujo simple, un proceso de pago confiable, assets visuales personalizados e interacción que hacía más fácil entender el valor de la asesoría.

Si retomara el proyecto, exploraría una diferenciación visual más fuerte entre planes y más tracking de conversión post-lanzamiento. La base es sólida, pero métricas más profundas permitirían refinar mejor la relación entre presentación de planes, intención del usuario y reservas completadas.

Tuve entrevistas con muchas personas antes de hablar contigo, y te escogí porque sabía que no me ibas a traer con vueltas. Supiste tomar todas mis ideas y llevarlas hacia adelante. Fuiste el más rápido en entregar.

Juan Zamorano, CEO, My Geek Advisor