Designing a Cohesive User Experience with GREDU’s Design Systems

Rizal Azhare
5 min readJun 8, 2023

Design systems are becoming increasingly important in the world of product design. They are a set of guidelines, principles, and components that help teams to create consistent and cohesive experiences across products and platforms. GREDU, as a leading EdTech company, recognizes the importance of having a strong design system to ensure a seamless user experience.

In 2022 I was part of an ambitious project to GREDU Design Systems for to be flexible, scalable, and easily adaptable.

To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of Uber.

Conditions

From 2018 to 2020, GREDU developed several platforms to cater to school needs, including the Student App, Teacher App, Parent App, and School Management Systems. Since its inception, GREDU has evolved into a competitive edutech brand in Indonesia, providing benefits for both businesses and educational progress in the country. However, there was a time-consuming and challenging process to ensure that the products delivered met the required design standards, particularly in product design, which focused on GREDU’s branding consistency.

The Challenge

When developing the GREDU Design Systems, our goal was to create a cohesive and visually appealing experience that would capture the essence of the GREDU brand. Our aim was to build a strong foundation that would accommodate the ever-evolving needs of the education industry, while catering to a diverse range of users.

Our high-level goals for the GREDU Design Systems were to:

  • Establish a consistent visual language that reflects the GREDU brand and values.
  • Make it easy and intuitive to use for students, teachers, parents, and administrators.
  • Provide a platform for innovation and customization, enabling users to tailor the experience to their specific needs.

As the product designer for the GREDU Design Systems, I collaborated with a team of designers, product managers, and Engineers. My role involved designing a design system that was adaptable and scalable, while also providing guidance on best practices and standards. We worked together to ensure that the design system was cohesive across all platforms, from the several App to the All-in School Management App.

After months of development, the GREDU Design Systems were launched, providing a consistent and visually appealing experience across all GREDU products. The design system has enabled GREDU to better serve its customers and stay ahead of the competition in the EdTech industry.

How we got there

Designing a System for Product and Engineering Team at GREDU

To create an effective design system for the Product and Engineering team at GREDU, several key questions need to be addressed:

  1. How do you design a system that caters to the needs of the entire team?
  2. What contexts and factors should be considered during the design process?
  3. What constitutes the ideal design system for GREDU?

To begin, it is crucial to understand the diverse factors that can influence the experiences of both the Product and Engineering teams. By mapping out these various elements, we can develop a comprehensive framework that covers a spectrum of situations.

Here are some considerations and steps to follow in building the design system for GREDU:

Understand the Team and Its Goals:

  • Conduct interviews and workshops with the Product and Engineering teams to gain insights into their needs, pain points, and delighted.

These early insights will inform the development of GREDU Design Systems, with a focus on creating a seamless, intuitive experience for all users and empowering them with the tools they need to succeed in their educational pursuits.

Define Design Principles:

  • Establish a set of design principles that align with GREDU’s brand values, vision, and user-centered approach.
  • These principles should guide the design decisions made by both the Product and Engineering teams.

Create a Component Library:

  • Build a comprehensive library of reusable components that can be shared across projects.
  • Document the usage guidelines and best practices for each component to ensure consistency and efficiency.
  • Consider accessibility standards and ensure that the components are usable by everyone.

Develop Visual Guidelines:

  • Define a visual language that reflects GREDU’s brand identity and conveys a consistent look and feel across all products.
  • Establish guidelines for typography, color palettes, iconography, and other visual elements.
  • Include responsive design considerations to accommodate various screen sizes and devices.

Collaborate and Iterate:

In our process, we embraced the task of understanding and exploring each other’s work areas to create excellent and scalable experiences for our goal. We achieved this by working closely together, both physically and digitally, through platforms like Slack, and by openly communicating our thought processes from start to finish.

To ensure alignment during project work, we emphasized the importance of clear understanding in the following areas:

  1. Problem definition: Focusing on a specific problem helped us align our design and engineering efforts.
  2. Impact : Understanding the impact of the problem helped prioritize tasks and determine the best approach.
  3. Potential solutions: Being open to different solutions made us adaptable and accountable for potential changes.
  4. Acceptance criteria: Progressing from a minimum viable product to a robust solution set clear standards.

By consolidating this knowledge within the team, we improved agility in decision-making and ensured that our final product met our intended goals.

Establish Governance and Maintenance:

  • Define ownership and responsibility for maintaining and updating the design system.
  • Establish processes for reviewing and incorporating new design patterns and components.
  • Regularly assess the effectiveness of the design system and make necessary adjustments to meet evolving needs.

Conclusion

In summary, our experience showed the importance of collaborative work between Design and Engineering. While collaboration may vary in different environments, small steps can be taken to improve it. Understanding each other’s work and challenges, being curious, and finding ways to make collaboration smoother are valuable exercises. For our team, this meant investing time in refinement sessions and encouraging constant feedback to validate ideas throughout the process. Every organization may have different processes, but through open collaboration, the team’s outcomes will improve. Additionally, working together brings joy, as it helps team members achieve more, leverage their skills, deliver better user experiences, and create greater business value, making work enjoyable every day.

--

--

Rizal Azhare

I'm a product designer with a passion for creating user-centered experiences that solve real-world problems.