Seu-monash website maintenance

Achieved pixel perfect implementation of original design. Improved usability. Added more pages.

Linkscarlettsan.github.io
DateOct. 2015
RoleFront-end Developer
MembersWangshu Sun

Live Demo: http://scarlettsan.github.io/ISM/index.html


 Problem: imprecise implementation

What it should look like

My implementation

My implementation was much more accurate than the original implementation, because I had redesigned the code structure.


Original design: jammed text and redundant element

After user interview, most people reported that the arrow before breadcrumb looked out of place, and the text was too cramped up.

My design

Removed arrow and added more spacing.
 

Information design / content writing

Regrouped the contents in navigation and corrected its English translation.

Before:

After:


Adding new pages with similar design

Created new pages with HTML/CSS/Javascript.