Building a digital identity from scratch

Role

UX/UI designer at Lúcid Design Agency

Team

Project Manager, User Researcher, 2 developers

Main Project Image
Main Project Image
Main Project Image

Problem

Non existent presence online

The company has aimed to take a leap forward commercially by launching its new website, which includes its extensive product catalog.

Outcome

Robust and consistent catalog

Based on the brand identity, I translated their physical presence to the digital realm by creating an essential set of components and designing interactions for each.
An experience designed for different user profiles and also an internal commercial tool to track potential customers according to their interests.

Process

01 —

Understanding the problem

I collaborated with Sensocar to identify user needs and, along with the Lúcid research team, created user personas. From there, we started laying out the first wireframes.

Design System
Design System
Design System

02 —

Building a scalable design system

I created a robust design system that established the foundational components for future digital products. This included key elements such as typography, iconography, buttons, text fields, and dropdowns, ensuring consistency and scalability across the platform. The system provides a strong framework to support current and future product development while streamlining collaboration between designers and developers.

🎨Color learning: We agreed with the developers to use HSL colors, which stand for Hue, Saturation, and Lightness. This is another way of declaring colors in CSS.

Large Project Gallery Image #2
Large Project Gallery Image #2
Large Project Gallery Image #2

Key quote

"Let's go with less effort for maximum impact."

Design manager during a meeting

Do you want to know more about the process?

Do you want to know more about the process?

Do you want to know more about the process?

03 —

Search bar

During the research phase, we found that loyal users look for products to check their technical specifications. Therefore, we included a search bar on the home page.

Large Project Gallery Image #3
Large Project Gallery Image #3
Large Project Gallery Image #3

04 —

Product view

Users can view various product categories at a glance, organized in horizontal blocks. For less experienced user profiles, we added a brief description to help them find their products.

Large Project Gallery Image #4
Large Project Gallery Image #4
Large Project Gallery Image #4

Impact

Revolution both internally and externally

During the first period after the website was launched, 30% of the overall leads arrived through the website form. The company now has an effective tool to showcase their products and acquire new clients. Sensocar has optimized the sales funnel, making the website a key element for their strategy. Meanwhile, existing clients can browse, discover new products, and request technical support if needed.

Contact

rocpratgrau@gmail.com

@

2024 Roc Prat Grau

Contact

rocpratgrau@gmail.com

@

2024 Roc Prat Grau

Contact

rocpratgrau@gmail.com

@

2024 Roc Prat Grau