Xi’an Jiaotong-Liverpool University (XJTLU) is a joint venture between China’s Xi’an Jiaotong University and the UK’s University of Liverpool. I led the redesign of their website, giving it a bold, international look that reflects its unique identity. My goal was to create a visually striking, flexible design that is easy to maintain and provides an improved user experience.

Objective 1

Develop a new design language

To elevate the XJTLU website's visual design to reflect the image of a global university rather than a local institution, while enhancing usability to cater to the diverse needs of its visitors.

Objective 2

User Experience Improvement

The focus extended beyond visuals. We aimed to enhance the user experience for diverse personas across multiple touchpoints.

Art Direction

Visual Style Definition

To ensure alignment with stakeholders, we defined the visual style before beginning the design process. This involves gathering keywords, insights, and expectations during workshops, creating a clear foundation that reflects the project’s goals and resonates with all parties involved.

Art Direction

Concept Development

We created two distinct concepts based on the style defined in the workshop. Both followed the same overall direction but differed in key details, allowing the client to choose the most accurate fit.

Art Direction

Concept Mockup

To deliver the most authentic mockup, I created interactive HTML prototypes, including demos of animations and transitions. I believe static designs are insufficient to fully convey the depth and dynamics of the design vision.

Design Production

Scalable Design

Most web pages are built using highly reusable modules, allowing XJTLU web admins to easily create visually appealing pages within the CMS without the support of a professional designer. These modules are fully responsive and designed to function in both Chinese and English.

Design Production

Pixel-perfect implementation

I didn't consider the design work done until the website is in the User Acceptance Testing phase because no matter how great a design looks in Figma, poor implementation can ruin everything. My front-end development knowledge worked to my advantage, I knew exactly where the problems are and can provide effective feedback to the dev team.