2022
Talentcity
Website Design
Overview
Talentcity is a Vancouver-based company offering international study and immigration services. They needed a clean, professional website that builds trust and drives inquiries. I redesigned the site from structure to final build in WIX, creating a responsive layout with strong CTAs. The final design balances content clarity with conversion goals, using simplified navigation and visual hierarchy to guide users toward key actions.
My Role
Wireframing, Prototyping, SEO, WIX Development
Tools
Figma, WIX
Understanding the Problem
Define the Problem
I audited the existing site and identified several visual and usability issues:
-
Service content was outdated and fragmented
-
Navigation lacked a clear hierarchy and logic
-
Layouts were inconsistent across pages
-
CTAs were scattered and lacked context
-
Low contrast made the content hard to read
Solution
To address these problems, I redesigned the site structure and layout with a focus on clarity and conversion:
-
Rebuilt the site map (as shown above) to reflect current services and user needs
-
Regrouped content into logical categories for easier scanning
-
Refined page hierarchy to guide users from the introduction to the inquiry
-
Placed clear, contextual CTAs along key interaction points
-
Improved typography and colour contrast for better readability
Wireframing
With the new site structure in place, I translated the revised hierarchy into low-fidelity wireframes. The goal was to establish clear content zones, intuitive navigation patterns, and a layout that supported both readability and user flow before introducing visual elements. I focused on three key page types:
-
Home Page: Clear visual identity with an immediate CTA, company introduction and contact form
-
Category Page: Visual cards grouped by service type for faster browsing
-
Service Page: Used a vertical step-based layout (inspired by timeline design) to make complex service info easier to follow
Style & Components
Before moving to high-fidelity design, I established a UI system to support long-term consistency and easier development.
-
Style Guide: Improved color palette and typography contrast for accessibility
-
UI Kit: Reusable buttons, cards, and form components
-
Layout System: Standardized spacing (8pt base grid), consistent padding (24–80px), and responsive type scale across viewports
Prototype
I created a high-fidelity prototype in Figma and built the live site in WIX. The final design focused on:
-
Responsive layout optimized across desktop and mobile breakpoints
-
Visual hierarchy that supports quick scanning and guides user actions
-
Structured content layout designed to reduce cognitive load and support decision-making
The launched site delivers a user experience that is consistent, intuitive, and aligned with Talentcity’s brand. Since launch, the site has generated steady client inquiries, demonstrating how clear navigation, purposeful CTAs, and UX-driven structure can directly support business growth.
Final Design
Reflection
This project taught me how to turn complex service information into a structured, action-oriented website. By reorganizing scattered content and rethinking hierarchy, I learned how design structure directly improves comprehension and engagement.
Working with Chinese content pushed me to pay closer attention to visual rhythm. Unlike English, Chinese characters are square in shape and denser in appearance. I had to adjust line height, spacing, and font weight to maintain visual balance and legibility, especially when paired with icons or bilingual labels. This process helped me understand how typography and spacing strategies must adapt across language systems.
I also built a scalable UI foundation using reusable components and flexible layout rules. Through that, I learned how to create websites that not only look coherent but also grow with evolving content and business needs.
More projects
