Student Facing Web Apps

The university aims to design, and develop a set of tool to help students plan towards graduation. These tools start from stating their intent to enroll, to course search, to term planning, and to degree planning.

There are other non-academia projects, such as tools to help students navigate, and get involved with the student organizations available on campus.


For most of the projects, the process start with an introductory meeting with the functional team to have an initial understanding of the requirements.

As I start to create wireframes, I will exchange correspondence with the functional team to make sure the design is still on-par with the requirements. And the wireframe is more or less finalized, I will create an interactive mockup by putting them together using either Axure or HTML/CSS. These will then be handed off to the developers.

With the recent introduction of Agile methodology, there is a faster feedback loop. This allows me to have a better understanding on how plausible it is to implement the designs. And I also start to have more control over the UI implementations.


As there is a lack of universal style guide, one of the primary challenge is to conjure an overall consistent look and feel across the various tools.


These are some examples of the projects that I had worked on. As resources were limited, I was often times the only designer for the assigned project, along with one other developer.

Intent to Enroll

This a preliminary wireframe on the “Intent to Enroll” page, where accepted students have the option to either ‘Accept’ or ‘Decline’ an admission offer.

Wireframe for Intent to Enroll (Desktop)

Intent to Enroll (Mobile)
Wireframe for Intent to Enroll (Mobile)

Degree Maps

Degree Maps aim to provide a transparent set of Degree Requirements for the various majors offered at the different university campuses. This project had started with designing for the printed version, before translating these information digitally.

Intent to Enroll (Desktop)
Sample Degree Map (Printed version)

Through various iterations, the digital version of the degree map had then expanded to include various other functions such as Search.


myInvolvement is a website dedicated to bridging students, and student organization. The redesign aims to present information in a more visual, and concise format.


Home of myInvolvement

List of Organizations in myInvolvement


Home of myInvolvement

List of Organizations in myInvolvement

These are a sample of the work I have done. For more details on the different projects (i.e. interactive mockups) please feel free to contact me.