Alpacar Website Design

Clients: Alpacar Associates
Role: User Interface Design & Project Management
Tools: Adobe Photoshop, Figma, Flowmap

Alpacar Associates is a boutique investment company that provides financial advisory services. They asked us to redesign the company’s website such that it improves the overall user experience and reflects the brand voice.

Information Structure

To be able to guide the client in creating the content we decided to start the design process by creating the information structure. After brainstorming sessions with Alpacar and competitive analysis of the market we came up with the information structure of the site.

Brand Voice

Relatively small companies such as Alpacar usually don’t have a comprehensive brand guide. Therefore, for this project ideation on the brand voice and how it is going to reflect on the design became the essential part of the design process. Therefore, I started deciding on the moods, styles and voice which would set the tone throughout the design process.

Mood: Bold, Positive, Motivated, Committed, Excellence, Trusted, Quality
Style: Consistent, Clean, Informative, Creative and Classic.
Voice: Professional, Dynamic, Unique, Adaptive, Skillful.

Colors and Typography

A good starting point when designing a digital product is deciding on one primary color and a state (accent) color. Alpacar didn’t have any brand colors except the dark blue color used in the logo. Based on that color, I decided a dark shade of that color as my the primary color of the website. Dark blue is associated professionalism, trust and formality which coincided with the brand voice we were aiming for.

As an accent color, I selected a lighter shade of blue. Usually choosing a complementary color can be more stimulating and dynamic. However, in this case because the brand does not use any other colors than blue, choosing a completely different color as an accent like orange would have been major design decision for the brand and I avoided that.

As a typeface I decided on Roboto family. Roboto looks clean and gives a sense of professionalism. It has the ability to scale and it is very legible. To variate the use of typography and establish hierarchy I used different weights and styles of Roboto family.