↑Top
Last updated 2017. New site coming early July 2019. Updated Resume

LIANG

CUI

中文 | English
PRODUCT/UX
GAME DESIGN
CONTACT
MA in HCI @ MSU
BA in Software Engineering, @ NWU(CN)
PDF RESUME
Product Management
User-centered Design
Research
Wireframing
Axure Prototyping
Documentation
UI Design & Coding

Products and Designs

Click to see a section or keep scrolling to see them all.

Wireframes, Flows & Designs

Interactive Prototypes

Design Research

Design Documents, PRDs

Visual Design & Coding

Fun Stuff

My skills focus on communication, then the interaction, the logic, and how each module connects in the way that is scalable, effective and efficient for the end-user to reach their goals.

I can also do visual design and some coding. While they are not my selling point, they help shape my design approach, allowing me to communicate better with UI designers and the dev team.

An illustration of how I work:

Wireframes, Flows & Designs

selected works



Top Expert Leaderboard Update - Fixya

A more content rich gamification system improvement.

About

An iterated version of the existing leaderboard system. Richer gamification content covering broader user activities benefiting the growth of community.

Mobile "My Home" Page Design Update - Fixya

Exposure of affordance and content of the site.

About

The old design doesn't provide any affordance or proper exposure of the website content. The design goal was to fix these issues.

Online Operation Platform - ALO7

The online system which supports the whole operation of Alo7's online education busniess.

About

The B2B system now supports over 20,000 online classes per month, allowing an operation team of less than 20 to support the business of over 1000 teachers, dozens of major client schools and their 30,000+ students.
*Due to NDA I can't share any design detail of the actual system.*

MSUFCU - Official Home Page Redesign

Better visual + improved UX


Old site, new look

First and foremost, the new site is designed mostly based on the original layout to
make sure the user will still navigate easily after switching to the new site.
Then I seperated the panels to help user recognize each tile more easily. With the color
theme green and white, the new design brings out more energy and also and the same time more elegance.
(Click http://www.msufcu.org to check out the current (old) design)


Accont Page after logging in


Improved User Experience


Achievement System Overhaul - Fixya

Gamification system with real impact.

Complete, Systematic Gamification

Richer Content

Expanded the original 8 achievements to 50 achievements, providing rich, fun and engaging challenge activities for users.

Positive Reinforcement

The new achievement system is designed to encourage expected behaviors from the users in various aspects.
Icons are works from my collegue Sukmoon Chang

Effective Exposure & Incentive

For more information on the achievement system, check out http://www.fixya.com/experts/achievements

Oracle - Fund Distribution App

Oracle interview submission. An easier solution for funding distribution tasks.

This funding distribution is designed specifically for making the job of budget analyst easier with intuitive affordance and feedback,
simple interaction flow and features to help reduce repetitive work.


Use Flow - Framework

Data & Graph View for Different Perspective

Intuitive Visual Feedback

For more details, see the next
section "Interactive Prototypes"


Interactive Prototypes

selected works

Same-Day Flower Delivery App

Designed with Axure

SF Delivery Axure Protoptype

Fixya Navigation Re-design

Improvement on navigation flow

Fixya Redesign

Fixya - Achievement Center

A dynamic achievement page inspired by games

Fixya New Achievement

Research

seleted works

IKEA User Manual Usability Study

The magic of intuitive guide without words

IKEA manual usability research

Fixya User Base Research & Persona Creation

Help finding the correct direction on early concepts

Fixya User Base Research & Persona

Site Navigation Structure Research (Notes)

Finding a better direction for site navigation

Fixya Navigation Research

Inspiring books I Loved

And UX research sites I enjoy visiting

The Elements of User Experience
The User Experience Team of One
Don't Make Me Think
Hooked
NNG
UX Booth

Design Documents

Due to NDA, details of some PRDs are blurred out

Fixya Desktop
Want Answer System

 Fixya Want Answer
Inspired by Quora, adopted and designed for Fixya's community to boost communication and engagement among users and experts.

Fixya Desktop
Notification System

Fixya Notification
Bringing users the critical information they care about in the most convenient way.Designed based on the notification system norm from research.

Fixya Mobile
Notification System

Fixya Notification Mobile
The mobile counter part of the notification system, designed to provide intuitive affordance in the mobile environment.


Fixya Desktop
Video System

Fixya Video System
A brand new system designed to intergrate with the existing site, exploring the age of user generated content of videos.

Fixya Desktop
User Content Moderation System

Fixya Moderation System
A unique system designed for Fixya to allow moderators to exam and clear trash or spam contents on site quickly and accurately

Criminal Procedure - GEL
Design Document

Criminal Procedure Design Doc
A game designed to simulate police investigation scenarios to help law school students learn and practice textbook content.


Fixya Mobile
Video System

Fixya Video System Mobile
The mobile counterpart of the Video System. Intergrating all the consumer side of the system with the existing mobile site structure.

Saving Magic - GEL
Design Document

Saving Magic Design Doc
A client project, teaching middle schoolers the benefit of bank saving through an engaging, motion-controlled mobile game.

DinoFightingSaurs
Design Document

DinoFightingSaurs Design Doc
A multiplayer only competitive game designed as one of my class projects, aiming at allowing players to change level dynamically as they play.


Visual Design & Front-end Coding

selected works

Android Native App Dev

Clarinet Fingering Companion

Commercial Page Design

iOS Native App Dev

Clarinet Fingering Companion

Commercial Page Design

Commerical Landing Page

An HTML + CSS Project

Commercial Page Design

MSUFCU - Official Desktop Page Redesign

An HTML + CSS Project

MSUFCU ReDesign

This Website

From start to finish, I designed and wrote this website on my own on the cloud IDE of c9.io.
Also made my own lazy load system. 3rd party plugin includes videojs, fotorama, and dataTables.

This page

Visual / UI Design Gallery

Photoshop / Firework Projects

Fun Stuff

Side projects I did for fun

Selected Video Projects

Video projects I do for fun in my spare time

Saving Magic Official Trailer

https://www.youtube.com/watch?v=4qfbXc0VM2Y
Aiming at bringing out the light hearted aspect of the game for the target audience, with a great harmony with the background music.

It follows the a introduction - elaboration - climax pattern, and does a close touch up on the theming of the game itself. The trailer for saving magic is unique than the ones I usually make.

Duration: 01:03

Dragon Age Inquisition Trailer

https://www.youtube.com/watch?v=zLdjEJU6BOA
I'm a huge fan of both Dragon Age series and The Witcher series, and when The Witcher 3's Sword of Destiny trailer came out, my jaw dropped at how amazing that trailer was, and also said that it seems none of the Dragon Age Inquisition captured the the best part of the game as The Witcher's trailer did.

For me, all that matters is good music. Without much thought, I went in and grabbed the audio from that Witcher's trailer and made a fan trailer for DAI.

Duration: 02:24

Gavin of Canadia Official Trailer

https://www.youtube.com/watch?v=vUIiT-4kbQQ
Gavin of Canadia is a game with humorous theming, and that is what I started with when brainstorming this trailer.

I aimed at making a thriller movie trailer, in contradition to the silliness of the game itself, and it's proven worked out greatly on the MSU Media Sandbox Showcase.

Duration: 01:08

Half-Life 2 Level Design Techniques

https://www.youtube.com/watch?v=lgAiTqK6Nk0
Something I made a while ago for a class project. I summarized 8 level design techniques I learned from Half-Life 2 level designs.

Duration: 09:25

I'm also a game designer.

Want to check out the games I made?
UX/PRODUCT
GAME DESIGN
CONTACT

Stay in touch

[email protected]

Behance Facebook Youtube

DESIGNED & CODED by LIANG CUI © 2013 - 2017