Think of Charette as a hackathon platform for architects, where we empower architecture students and emerging professionals to display their design skills and earn recognition. Experts in the field, including well-known architects, decide who wins.
My role: Product Design, User Research, Design System
Team: 2 designers
Tools: Figma, WordPress, Elementor, HTML/CSS
Timeline: 8 months
In this case study, I’ll tell the abridged story of Charette since 2020. During this time, we went through countless iterations, many successes, some mistakes, and lots of learning.
The Problem:
Lee, a passionate architecture student, seeks to enhance his skills, build a portfolio, and gain recognition and confidence to secure his dream job or clients after graduation. However, the pandemic confines him to his home, limiting his experience.
Outcomes:
Business Impact:
Charette was built in parts, launching, learning, iterating, and adding more features:
Phase 1: Discovery, Registration, and Results
Submission and evaluations were done via third-party services.
Phase 2: Participant Portal
For participants to manage their teams and submissions.
Phase 3: Evaluation Portal
To make judge’s user flow efficient & announce results faster.
As former architectural designers, we had to be aware of our biases and assumptions. Since we had previously participated in a few design competitions, we needed to be thorough and careful in our research.
Before product launch:
After product launch:
Factors Involved in Choosing a Competition:
An Expensive Assumption:
Initially, we believed cash prizes and entry fees were primary motivators. Yet, our research disproved this, enabling a 33% operating cost reduction.
Source: Google Analytics
This persona is based on interviews and the quantitative data of participants of Charette’s competitions.
This persona is based on the 50+ renowned architects who have served as judges for Charette.
HMW help Lee challenge himself, build his portfolio, gain recognition, and maintain productivity while he’s constrained to his home?
HMW create an online architecture competitions platform that facilitates the entire process for aspiring architects & professionals alike?
HMW design a trustworthy, and efficient evaluation system that caters to the unique needs of judges across a range of competitions?
We believe that creating an online architecture competition platform for Lee, a passionate architecture student, will help him enhance his skills, build his portfolio, and gain recognition.
We will know this is true when we see 100 registrations from users within the first two months of the platform’s launch.
Why 100 registrations? Because that’s the number needed to make the platform financially viable.
Upon a user’s selection of a competition from the homepage, the visibility of specific pages hinges on two key factors:
Competition Status: This status can vary, encompassing phases such as “Registrations Open,” “Evaluation in Progress,” and “Results Announced.”
User Type: The user’s role within the platform is the second determinant, with potential states including “Not Logged-in,” “Logged-in as Judge,” and “Logged-in as Participant.”
My brain is most creative when I can sketch ideas on a blank infinite canvas on an iPad app like Freeform or Concepts.
This prototype was used to test a judge’s user flow for evaluating competition entries.
Optimized Grading with Sliders: Participants found slider-based grading more user-friendly than form-style evaluation, particularly on mobile devices. It reduced interruptions caused by keyboard pop-ups.
Streamlined Scrolling: Excessive scrolling was a pain point, especially on smaller screens. We reevaluated content hierarchy, making essential sections more accessible, minimizing the need for extensive scrolling.
I created and maintained the Charette design system from scratch. It borrows guidelines and best practices from the Material 3 and Polaris design systems.
It’s only as comprehensive as our product and team require. Its primary purpose is to enforce consistency and simplify UI-related decisions.
This helped build consistent molecules like competitionCard/horizontal, competitionCard/vertical, and juryCard shown below.
Users can switch between tabs to easily see information related to the competition such as the brief, jury panel, results and the submissions.
Judges can see all submissions for the competitions they are on the jury panel for and evaluate the entries right inside the portal.
Judges can use sliders to grade the entries of four pre-determined criteria and easily give feedback with the help of the ChatGPT API.
Woohoo! Another competition comes to a successful conclusion. The results have been announced and the winners rejoice. It was a great learning experience for all participants.
As a designer, I’ve undergone significant growth throughout the years. With the knowledge and insights gained, I would make several vital adjustments if I were to redesign this project today:
Workbench-style virtual lab environment for electrical circuits training.
Social app encouraging climate action with fun challenges and incentives.
A smart goniometer for physiotherapists that makes patient assessment efficient.
