FAW-Volkswagen
Component Library Website

The goal of ONE Design was to create an open-source VUE component library that would aid programmers in developing enterprise applications of the highest caliber. In light of this, we also want the components to be simple to integrate and modify to fit any existing application without changing the existing styles.

Role

Project Manager
User Research
Experience Design

Client

Volkswagen

Year

2019

Challenge

Diverse User Roles:

FAW China likely has many user roles, from engineers to managers to sales representatives. Each user role will have different needs, tasks, and proficiency levels. The design must cater to all these different roles without making the interface too complicated or intimidating.

Complex Business Processes:

Large organizations often have intricate business processes. These processes need to be well understood and accurately represented in the system. Misunderstanding or oversimplifying these processes can lead to a system that doesn't actually meet the organization's needs.

Scalability:

The system must be able to handle growth in terms of both user base and business complexity. Designing for scalability from the start can be difficult, but it's essential for avoiding major overhauls down the line.

Consistency Across Platforms:

If the component libraries are to be used across numerous system platforms, maintaining a consistent look, feel, and functionality across all these platforms will be challenging. Discrepancies could lead to confusion and reduce user efficiency.

Solution

1.Functional Exploration:

In the initial stages, the team focused on understanding and exploring the key functionalities that the product needed to offer. This involved a deep dive into the specific tasks that different user roles would need to perform with the product, as well as the overall goals of the business. This exploration phase likely involved activities such as user interviews, stakeholder interviews, competitive analysis, and user journey mapping.

3.Proof of Concept Development:

Simultaneously, a small development team began building a proof of concept. This is a simplified version of the product that is designed to demonstrate that the core functionalities and behaviors are technically feasible. The proof of concept is not intended to be a fully functional product; rather, it's a tool for validating the design decisions and identifying any technical challenges that need to be addressed.

2.Behavior Definition:

Once the team had a strong understanding of the necessary functionalities, they then worked on defining the behaviors of the product – in other words, how the product should respond to user interactions. This definition process is crucial for ensuring that the product is intuitive and efficient to use. This likely involved creating interaction models, wireframes, and user flow diagrams.

4. Iterative Process:

This entire process – functional exploration, behavior definition, and proof of concept development – was not a one-time thing. Rather, it was repeated in several iterations. Each iteration provided feedback and learning that was used to refine the product in the next iteration. This iterative approach is a hallmark of agile and lean development methodologies, and it's designed to ensure that the final product is as closely aligned with user needs and business goals as possible.

DISCOVER

Insights from Internal Survey

We sent the survey to FAW-Volkswacen employees via email and received 1,047 valid responses.

71%

of tasks require employees to work from anywhere at any time

23%

of the intranet, usage scenarios occur outside of work hours

87%

of employees need multi-device accessibility

UX Audit of Internal Systems

We conducted a comprehensive UX audit of the internal systems, which helped us identify issues with layout and design, content and sustainability, architecture and navigation, and behavior and interaction. These insights were invaluable in guiding our design improvements.

Audit dimension

Key Findings of the UX Audit

Layout and Design

Inconsistent application of UI components across different pages results in a lack of visual coherence.
The information architecture needs improvement: hierarchy, iconography, and other visual cues are unclear, leading to user confusion.
The system's usability is compromised due to low recognizability of various user interface elements.

Content and Sustainability

The system falls short in user-friendliness: the absence of global and secondary page search functions prevents efficient information retrieval.
High frequency of repetitive tasks and underutilized relevant information decrease the system's efficiency and usability.
Content presentation issues exist, such as overly technical language, lack of effective information categorization, and unclear functional hierarchy.

Architecture and Navigation

User control is limited: missing return functions at sub-content levels disrupt the navigation flow.
Lack of necessary operations such as "undo" and delayed user feedback hamper the interaction experience.
The system's navigational design is convoluted, with excessive content and unclear hierarchical structure leading to potential user errors.

Behavior and Interaction

The system lacks user-centric design: clear guidance and prompt provision are insufficient, negatively impacting user experience.
Absence of operational restrictions and input validation increase chances of user errors.
Interaction design flaws exist, such as inconsistent logic across different pages and inadequate information support at key user decision points.