dark

Conectando Trabajos Terciarios con Yoppen

Transformación Digital: La App que Rompe Barreras Laborales

Proyecto Universitario para Proto-Fest

Imagen larga
Imagen del PC
album1

Propósito de la creación de la app:

Nuestra iniciativa se centra en abordar la problemática existente en los servicios terciarios, caracterizados por su limitada integración con las nuevas tecnologías, lo que ha resultado en escasas alternativas para su acceso. Con el objetivo de superar este desafío, hemos colaborado para desarrollar una aplicación que ofrece una solución simple y conveniente al alcance de todos. Esta aplicación abarca una amplia gama de servicios terciarios, mejorando su accesibilidad al consolidarlos en un único espacio. Al facilitar la búsqueda y conexión entre usuarios y servicios, aspiramos no solo a resolver un inconveniente, sino también a fomentar la creación de nuevos puestos de trabajo en este sector.

De la visión a la realidad: Nuestro viaje a través del diseño

album1

¿Cómo Impacta la Elección Tipográfica en la Claridad y Estética de Yoppen?

La tipografía en la aplicación ha sido seleccionada con atención para optimizar la experiencia del usuario. Roboto, una fuente sans-serif, se elige por su claridad y legibilidad, con vértices suavizados y anchura equitativa. Montserrat, utilizada en los títulos, aporta una estructura geométrica distintiva y un toque moderno.

Ambas fuentes sans-serif se combinan para ofrecer una estética contemporánea y limpia, fortaleciendo la identidad visual de la aplicación. Esta elección no solo mejora la legibilidad, sino que también subraya nuestro compromiso con una experiencia de usuario coherente y atractiva, donde cada elemento tipográfico se selecciona estratégicamente para realzar la apariencia general y la usabilidad de la aplicación.

¿Cuál es la Lógica Detrás de los Iconos y Su Paleta de color Vibrante?

En la toma de decisiones del diseño de la interfaz, se han considerado cuidadosamente varios factores para garantizar una experiencia de usuario óptima y coherente. La elección de un estilo de iconos sin contornos y coloridos busca promover la simplicidad y la rápida identificación de funciones.

Los botones de navegación morados, con transición a blanco al seleccionarse, se fundamentan en la claridad visual y la coherencia estética sobre una barra de tono morado más claro. En el menú principal, la selección de iconos negros añade un toque de elegancia y destaca la importancia de las opciones disponibles. Estas decisiones buscan no solo optimizar la usabilidad, sino también establecer una identidad visual distintiva y agradable para los usuarios, promoviendo así una experiencia de usuario intuitiva y atractiva.

album1
album1

¿Qué Estrategias Guiaron el Diseño de Navegación para la App?

La navegación en la app ha sido estratégicamente concebida para ofrecer a los usuarios una experiencia fluida y eficiente. La disposición lógica de los elementos en la interfaz, en conjunto con botones de navegación morados que transicionan a blanco al ser seleccionados, crea un contraste visual distintivo y facilita la identificación de funciones clave. La elección de iconos sin contornos y coloridos mejora la claridad visual, agilizando la comprensión inmediata de las acciones disponibles.

La barra de tono morado más claro refuerza la jerarquía de la interfaz y mantiene la coherencia estética. Estas decisiones de diseño, enfocadas en la usabilidad y accesibilidad, resultan en una navegación intuitiva que enriquece significativamente la experiencia global del usuario en la app.

¿Cómo Influencia la Elección de Colores en la Experiencia de Usuario de Nuestra Aplicación?

La paleta de colores en la aplicación se ha seleccionado considerando la psicología del color y los objetivos de diseño. El morado ha sido elegido por sus connotaciones de creatividad, innovación y calma, transmitiendo una sensación de sofisticación.

Este tono sugiere originalidad y destaca la singularidad de la aplicación en el mercado. En cuanto al azul, se ha seleccionado por sus asociaciones comunes con confianza, profesionalismo y estabilidad, reforzando así la credibilidad de la marca de la aplicación. La combinación de morado y azul busca equilibrar la expresividad y la confianza, creando una experiencia armoniosa y atractiva para los usuarios. Estos colores se alinean con la identidad de la aplicación y mejoran la legibilidad de la interfaz, contribuyendo a una experiencia visualmente agradable y memorable.

album1

¿Como se hizo posible?

ADOBE ILLUSTRATOR

ADOBE XD

Adobe Illustrator, una herramienta clave en mi proceso de diseño para la aplicación, es como mi lienzo digital. Esta aplicación es genial porque me permite crear gráficos vectoriales, que son esenciales para lograr iconos y elementos visuales nítidos sin perder calidad al cambiar su tamaño. Imagina que cada forma y color que ves en la aplicación se concibe y da forma en Illustrator.

Cuando necesitaba iconos únicos y atractivos, Illustrator ofrecía un abanico de herramientas y formas personalizables que hacían que el proceso de diseño fuera tan intuitivo como dibujar en papel. Además, para establecer la paleta de colores que define la identidad visual de mi aplicación, Illustrator facilitó la creación y organización de combinaciones de colores personalizadas.

Una de las cosas más útiles fue la capacidad de crear formas precisas. Necesitaba elementos específicos de interfaz, y Illustrator me permitió ajustar tamaños y proporciones con precisión. Además, trabajar con capas fue clave para organizar los elementos complejos, como los iconos, facilitando la edición individual de cada componente.

Lo genial es que Illustrator no solo es mi estudio de diseño, sino también mi caja de herramientas para exportar gráficos en diferentes formatos. Esto facilita la integración del diseño en el desarrollo de la aplicación sin perder calidad. En esencia, Illustrator no solo me proporciona las herramientas necesarias para diseñar visualmente, sino que también actúa como un puente fluido entre la creación y la implementación en la aplicación.

Adobe XD, mi aliado en la maquetación de la aplicación, es como mi taller digital donde cada detalle de la interfaz cobra vida. Esta aplicación es especialmente útil porque se centra en el diseño de experiencia de usuario (UX), permitiéndome crear prototipos interactivos y animaciones que dan vida a la aplicación incluso antes de que esté programada.

Cuando se trata de maquetar la interfaz de usuario, XD es como un lienzo interactivo. Puedo diseñar cada pantalla de la aplicación, colocar botones, animar transiciones y ver cómo interactúan los elementos. Es como darle vida a la aplicación antes de que exista realmente.

Los botones animados son uno de los aspectos más destacados. Con XD, puedo agregar transiciones suaves a los botones, haciendo que la experiencia del usuario sea más dinámica y atractiva. La capacidad de previsualizar estas animaciones me permite ajustar y perfeccionar cada interacción hasta que sea exactamente como la imagino.

Lo mejor de XD es su enfoque en la colaboración. Puedo compartir fácilmente mis maquetas con otros miembros del equipo o desarrolladores para obtener comentarios en tiempo real. Esto agiliza el proceso de diseño y asegura que todos estemos en la misma página antes de pasar a la implementación.

Este programa es como mi laboratorio de ideas para la aplicación. Desde diseñar la disposición de cada pantalla hasta animar botones, XD me brinda las herramientas para visualizar y perfeccionar la experiencia del usuario antes de que la aplicación sea una realidad palpable.

Explora Más de mis Proyectos

Yoppen App Movil

Fan Page Avenged Sevenfold

Web’s Agencia Sitio Web