Leadership

Scaling

Execution

During 2022, I was tasked with leading a team to establish a crypto APP design system, as TT Wallet is an all-in-one solution for storing crypto assets and NFT collectibles. It's cross-chain compatible and enables users to explore ThunderCore's decentralized ecosystem of dApps, with over 400,000 monthly users.

TIME

2022.05- 2022.08 (3 months)

ROLE

Senior Product Designer

Resources Planning
Stakeholder Management
Project & Components Facilitation

Final Outcome

20%

Saved Time

95%

Components Search

Leading the team to created an APP design system

Updated Styles

Establishment of usage rules and workflow in collaboration with PMs and engineering team

Main Challenge

All design files were newly moved to Figma, and there was no existing design system for the product.

I found out similar components were often found on different file, and the overall brand was updated that year, requiring the establishment of a complete design system and the updating of the brand style. There is also needs to consider consistency on the company’s different products.

Competitive analysis is a key aspect when in the beginning stages of an SEO campaign.

Far too often, I see organizations skip this important step and get right into keyword mapping, optimizing content, or link building. Capitalize on low hanging fruit to identify a ballpark value added activity to beta test. Override the digital divide with additional clickthroughs from DevOps.

Design Process

From clarifying the problem to setting clear goals and updating the design style, I conducted the design team and we collaborated with product managers and engineers to ensure meticulous attention to every detail of the product.

Understand The Problem

To assess the current design system needs, I reviewed past and current product files and conducted team interviews to understand collaboration between product managers, engineers, and designers. I also searched other design systems to assist with classification what our product needs on design system.

😟 Inconsistent components

Due to the absence of a design system, similar but different components appear across various pages and files, often requiring repetitive communication in meetings

#Design Team

#PM Team

😟 Lack of standardization

Inconsistent display of numbers, dates, and other elements
Similar components are not standardized; each one is customized separately

#Engineering Team

#PM Team

😟 Outdated style

The current style does not align with the updated brand image. We hope to create a refreshed style that matches the brand, as users are eager for this style update based on their feedback

#Design Team

#Marketing Team

Opportunities

Build the structure of design system

I collaborated with designers to inventory existing components and classify them based on industry and product needs.

Goals

Establish design system and component updates for consistency.
Document and standardize components.
Stylistic production (Phase 1 -> Phase 2)

Propose design styles through branding workshop

I began with leading a brand workshop and defining our target audience with the design team. We worked together to establish the desired design direction for the product. From several pages designed by the team, we set the style direction for the next phase. I then assigned designers to collaborate on completing the components.

Through conducting branding workshop, I led the designers in planning the next phase of design direction

The design style is divided into several stages for production through discussion with product lead.

Build Design System

Update color system

Collaborated with designers to discuss and reorganize relevant colors based on the updated Design Guideline of the year. Also updated status colors according to the needs of the app.

Documentation: Standardizing Numeric, Date, and Wallet Address Formats

While organizing the app pages, inconsistencies were found in numbers, dates, and wallet addresses were displayed. After discussions with project manager, engineers, and designers, a common set of rules was established and documented. These rules have been updated in the Design System.

Review & Discuss

Once all the components were created, I held meetings with the engineering team and project managers to discuss which components needed to be developed into engineer-ready components. We also addressed inconsistencies in the usage of certain components and, after discussing with the engineers, established a unified format for their usage.

Establish Workflow

Establishing Design System Workflow

I compiled the collaborative process for component development involving designers, project managers, and engineers.

Design & Development Process

The Design System has a categorized list with emojis to show the development status of components, aiding quick understanding for designers, engineers, and project managers.

Created Design System
for Crypto Wallet

TIME

ROLE