Otomo's project was divided into two stages. The first stage focused on studying existing elements and product identity to define branding that gives the brand presence and elegance. This involved competitive analysis and researching the product name and its meaning, resulting in a simple, visible, and scalable logo. The color palette was determined based on initial explorations by the executive team, with slight adjustments for uniformity.
In the second stage, we defined the foundations of the branding, including spacing, color palette, and typography. A design sample was created to refine usage and make adjustments. We then worked on information architecture and coordinated with the Writing team on content for each page, which was reviewed with the client. Low-fidelity prototypes were created to identify main components and start the design system.
Once sections and components were defined, designs were created for compatibility between desktop and mobile versions. Testing determined final changes to components and validated their scalability. A functional and easy-to-use system was developed, requiring minimal future changes. The final file, including business and marketing rules, was delivered with documentation within 3 months, leading to the design of the official website.