Free Template Android & IOS applications

Sketch

Cree hace pocos días estas plantillas para que me ayuden a la hora de diseñar las aplicaciones… ya sé que hay infinidad de ellas en internet, pero como soy un poco quisquillosa con el diseño y ninguna me gustaba decidí de hacerme la mía un poco a capricho de lo que yo realmente quería.

La verdad es que el diseño es una de las partes más entretenidas de la creación de una app. Si es verdad que a veces no quedan claros los pasos que se siguen para la elaboración del diseño, pues bien, estos son los diferentes pasos que existen y los que en teoría hay que seguir:

Sketch >> Wireframe >> MockUp >> Prototype

Aquí diverge entre los que pasan del sketch a escribir código directamente, los que realizan el sketch y con este directamente hacen el prototype y empiezan a escribir código, los que siguen el patrón de diseño completo, los que empiezan directamente con el código… en fin, tantas combinaciones como diseñadores y programadores haya en el mundo.

Y bueno, para lo que no sepáis bien de que os hablo, que son y cual es la diferencia entre todos estos elementos os lo explico a continuación:

El Sketch es una herramienta que nos permite definir a grandes rasgos lo que es nuestra aplicación y suele realizarse a lápiz. A este no le hace falta tener hasta el último detalle de la aplicación, simplemente es un punto de partida.

Por eso la plantilla que he creado, para ayudar a la hora de diseñar, porque así ya tienes el esquema de donde se va a encontrar la aplicación y solo centrarte en el diseño que va en su interior. Estas plantillas las podréis descargar al final del post.

El Wireframe es un esquema más detallado donde se muestran los principales grupos en los que se va a dividir el contenido, como vamos a estructurar la información y anotaciones como el tamaño de iconos, fuentes, etc.

El MockUp es una representación gráfica que es estática y que ya muestra contenido de ejemplo que nos permite visualizar de forma real cual sería el acabado de nuestro proyecto.

Tanto para wireframe como para mockup utilizo aplicaciones como Illustrator y Sketchapp.com

El Prototype es una presentación interactiva del producto final, este es navegable y permite realizar clicks, gestos, o lo que quiera que nuestra app haga. Esto nos permite ver y experimentar la experiencia de usuario.

Yo para esto he utilizado herramientas como invisionapp.com y marvelapp.com

Lo interesante es que, si usas sketchapp para el mockup, marvelapp tiene un plugin para esta aplicación te permite importar el proyecto directamente con 2 clicks de ratón a marvelapp.

Bueno, pues no me extiendo más y os dejo con las plantillas. Para estas me he basado en los modelos del iPhone 6 y Nexus 5.

iphone-6nexus-5

Espero que os sirvan.

Saludos,

Logo cdlsaints

Article by cdlsaints

Dibujo, desarrollo aplicaciones y me encanta el diseño.

Be the first to comment

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *