Your Webflow Page
XCUBE

Redefining 3D Modeling Tools for Architectural Designers

Full-Time Job at CBIM | Jun 2020 - Sep 2021
Project Overview
Team
Responsibilities
  • I joined the team in the project's early stages to develop XCUBE, an online 3D design tool tailored for architectural designers. I designed over 40 features, taking the tool from concept to market success, ensuring an efficient, intuitive, and intelligent modeling experience.
  • 1 UX Director
  • 1 Senior UX Designer
  • 2 UX Designers (Including me)
  • 3 Product Managers
  • 20+ Software Engineers
  • UX Design (Web), 3D Design
  • User Research
  • Usability Testing & Evaluation
IMPACT

0 -> 16,000+

REGISTERED USERS

With my contributions from scratch, XCUBE achieved 16,000+ registered users by the the end of 2021

400+

FINISHED PROJECTS

With 20+ features that I designed, users finished 400+ architectural design projects with XCUBE

$4,900,000+

ANNUAL REVENUE

With the help of XCUBE, the company achieved an annual revenue of $4,900,000+ in 2021

01 THE CHALLENGE

Pain Points

#1 Team Collaboration

In 2020, the majority of architectural design software was local, which hindered team collaboration by causing version control issues and restricting real-time updates, resulting in inefficiencies.

#2 Broken Workflow

During the project design process, architects must transition from one tool to another at different stages without a seamless workflow.

02 DESIGN QUESTION

“How might we increase the efficiency of architects throughout the project design process?”

03 INTERVIEW

Understanding Architects

I participated in interviewing 5 architects with varying experience (1-11 years) to find out about their current workflow, the tools they used and their positive and negative attitudes towards their work. I contributed to question design and qualitative data analysis, while 2 other designers conducted the interviews.

04 KEY INSIGHTS

Gap between Expectations and the Situation

Meaningless but strenuous

Too busy to learn new things

Little sense of accomplishment

Limited by tools, they invest ample time in arduous yet insignificant tasks.

They desire to employ new tools, but the complex features leaves them insufficient time to learn.

They aim to create a cool design but are stuck with repetitive tasks.

High-Priority Design Requirements

#1 Efficient

Streamline design and collaboration to optimize user efficiency.

#2 Intuitive

Affordance matters, achieved via clear info structure, workflows, and visuals.

#3 Intelligent

Speculative design on how to leverage AI capabilities to arouse creativity.

05 DESIGN FEATURES

Example 1: Default 3D Environment of New Project

Developed without Design

The previous default 3D environment faced challenges as it was developed without a design phase. The lack of a structured design approach resulted in negative user feedback, including uncertainties in axes orientation, reference object, and zoom distance. A comprehensive design strategy was needed to turn such uncertainties into a refined default 3D environment.

Competitive Analysis

As a default 3D environment is commonplace in 3D design, I started off by researching competitive tools to understand users' existing familiarity with this essential feature.

Rapid Iteration and A/B Testing

Given the professional background of the target users, it is crucial to align the 3D design with their spatial cognition. I conducted three rounds of A/B testing through rapid prototyping, collaborating with an experienced architectural designer to gauge user expectations regarding the proper angle, reference object, and zoom distance within the 3D scene.

1st A/B Testing — Proper Angle

During the initial round, I presented three different angles (A, B, and C) to identify the optimal axes orientation and enhance the 3D sense. Feedback from the user revealed that Option C emerged as the most favorable angle.

2nd A/B Testing — Proper Reference

In the second round, a person and a car were introduced as reference objects to determine the most suitable choice. User feedback favored a human as a reference point over a car, given architects’ familiarity with human scale.

3rd A/B Testing — Proper Zoom Distance

The third round focused on refining the zoom distance by placing the view at two different distances from the origin point. User feedback indicated that Option 2 provided a more appropriate distance in relation to the reference human.

These A/B testing iterations were instrumental in ensuring that the 3D design aligns seamlessly with the spatial perception of the target users, ultimately enhancing the user experience and usability of the design.

Reference Human

After selecting the proper angle, reference, and zoom distance, I proceeded to refine the reference human. I used the “Modulor”, a human body proportion well known to architects, as my drawing standard. Additionally, to establish a brand identity, I incorporated the product logo as a badge on the person's shirt.

Final Design

The final iteration presents an intuitive default 3D environment featuring clearly oriented axes, a reference human for dimension comparison, and a pronounced 3D sense. This design efficiently prepares users to start building a new model.

06 DESIGN SYSTEM

Color System

To understand user preferences and expectations, we conducted a survey about their color and style preferences for a 3D design tool's interface. The data from 56 valid respondents indicated that Blue (57.1%) was the color they would feel most comfortable with a tool's UI. In terms of software style, Rational (46.4%) and Bright (39.3%) were the favored choices.

UX Writing

Professionalism

Maintain a professional tone that is formal, clear, and conveys a sense of expertise to establish trust and credibility with the users.

Consistency

Use the same terms, phrases, and instructions  throughout the software to improve user understanding as they interact with different parts of the product.

Positivity

Maintaining a positive and encouraging tone in the UX writing to motivate users and make them feel confident while using the software.

Helpfulness

Be helpful and provide clear instructions, tips, and guidance to assist users in accomplishing tasks without unnecessary frustration and achieving their goals effectively.