website
Vibrato
Vibrato is an innovative design studio, however it did not have a branding that reflected the creative and innovative capacity of the organization. In order to project the desired image, we rebranded and designed a new website. We designed a new graphic style and applied storytelling to explain what Vibrato is in an interactive and exciting way from start to finish.
How to create a website that explains who we are and reflects the company’s creative potential.
My role
- UX/UI
- Interaction design
- Web builder
- Website animations
Strategy
We take as a strategy to elaborate sessions of ideation and co-creation to integrate the Storytelling with the content and interaction.
- Define the problem
- Design Process
- Building Website
- Launch and Maintain
Prototyping
I made low-fi wireframes of the animations and interactions to ensure that all ideas were adaptable to responsive design. I developed a high-fi prototype so the team could visualize and refine the ideas.
Look and feel
We developed a concept called “Futuristic Black Interface” that complements the brand. The use of contrasts and the absence of color allowed us to spotlight the graphic arts and client projects.
Website building
It was time to turn the sketches into a fully functional website and do some user testing to make the final adjustments.
Final results
Outcomes
We managed to create an attractive website that explains who we are, what we do and how we do it. Thanks to the storytelling and the use of animated and interactive graphics, we created a WOW effect that invites users to explore the different sections of the website and understand the essence of Vibrato.
Main challenge
The main challenge was to build a website for the first time. I learned that designing a website requires a lot of teamwork to achieve impressive results.
Next steps
A website must be in a constant process of improvement, we will have to wait until we have enough data to analyze each section and identify opportunities for improvement.
Credits
CLIENT: Vibrato Studio
CONCEPT: Aarón Hernández, Antonio Camacho & Juan Pablo Blandón
DIRECTION: Aarón Hernández & Antonio Camacho
PROJECT MANAGEMENT: Antonio Camacho
UX: Juan Pablo Blandón, Aarón Hernández & Antonio Camacho
UI: Juan Pablo Blandón
INTERACTION DESIGN: Juan Pablo Blandón
CONTENT: Antonio Camacho & Violeta morice
ILLUSTRATION: Antonio Camacho
3D MODELING: Aarón Hernández
MOTION GRAPHICS: Aarón Hernández & Antonio Camacho
WEB DEVELOPMENT: Juan Pablo Blandón
WEBSITE ANIMATIONS: Juan Pablo Blandón
DATE: January 2019
