Gavin Low
6 min readMar 26, 2017

Redesigning NTU(RSIS) Website

The Brief was to propose a new information architect and redesign the university’s website according to the pleasure points, pain points, context and behaviour of the given personas.

This was an individual project but the amount of work was so massive, so we took initiative to collaborate with each other on research and analysis pharse. Thank you Freda and @Theresa Raj.

We decided to pool our research findings together and individually redesign the website.

The Personas a.k.a The Usual Suspects

Personas given as project project brief

So meet the usual suspects Mark, 17, prospective student. Jessica, 21, returning from break and John, 38, interested in higher education.

Objectives they have in common:

  • Find out information on scheduling
  • Find out a lot of details about course description/syllabus
  • Find out degree requirements
  • Find out specific learning outcomes
  • Find out information about studying at RSIS

Digging and Dissecting:

Current Sitemap of RSIS + Faulty content

#1. Curating & Inventory.
We begin our research by curating RSIS website, we created an inventory of the all the content we can find on the website and drew a sitemap based the first 2 level of information. Technically, we should be able to find the sitemap on the webpage itself, however it is buried so deep we did not manage to retrieve it. So we used an online sitemap generator to create one.(We did this to ensure the sitemap we drew was accurate.)

#2. Heuristic Evaluation.
We also did a Heuristic evaluation by Jakob Nielsen’s standard. Initially it was a little difficult to grasp so referenced a simplified version and put it into layman terms for better referencing. (See above link)

Findings:
- Some of the links were broken
- Massive repetition of content (confusing)
- The ‘side bar’ and ‘bread crumb’ menu don’t tally (inconsistency)
- A few content were floating with no or weak action indication for user

#3 Card Sorting
This is the part where it is most fun but at the same time rather confusing. We are most amazed at how different people would organise information different, at times, same person would organise same content differently.

Same same but different, grouping by 3 users
Final 30 card for Hybrid card Sorting!

We started with open card sorting and after 3 iterations(2 days) of card sorting. We finally have our final 30 card and we used optimal workshop to do hybrid card sorting, to find common probability of our users grouping.

#3a Divide and conquer
At this point we tried contacting RSIS to get for permission for us to visit, so that we can do interviews and some user testing with the students. However they didn’t response until 2 days before our deadline. So we decided to divide and conquer. Theresa Raj aka Bulbbocs went and visit the school, she realised that school was off limits to public and there were not many RSIS students around to interview. Freda S. manage to find some of her friends who were doing similar course in NUS and did some usability testing with them. And I manage to get some friends of the same demographics as “John” to do some hybrid card sorting. After which we shared our learnings with each other and got a better insight of what we were working on.

Mr Mervin Kok, Acting Corporate Communications Manager provided some insights via email. 22/03/17
We combined our efforts and got our final results. See Full Results

#4 Persona + Content Mapping

From there, I decided to work on “John”, perhaps I can resonate with his persona more. So with the new findings and result, I moved forward with content mapping to get a better understanding of the task needed to accomplish.

John’s content mapping

#5 Proposed Information Architecture + Persona User flow

Proposed Information Architecture & Persona’s Userflow

After gathering the best merge results we had to review all our findings and exercise some initiative, combining of some sections and renaming certain categories were necessary to generate a clearer and more concise user flow.

#5 Wireframes + Usability testing

Quick sketch and stick menu

Time we all know, time and tide waits for no prototype. I resort combine sketching wire frames and usability testing before moving on to creating my prototype.

Pen, pencil, stickies and paper are the fastest way to conceptualise wireframes. It allows us to plan and make iteration quickly.

This step gives me an overview of what my website will look like and allows me to create a checklist of what needs to be created. A good form of reference point especially when you are braindead.

Testing navigate my paper ‘website’

Once I got my final sketchy wire frames out, armed with a sticky as my menu, I conducted some user testing made some iterations with users’s feedbacks and suggestions and proceeded to creating my prototype.

As time was ticking by, I tested my prototype as I went along and made iterations and was finally satisfied with my prototype.

Finally Final Prototype

Final prototype. Demonstrating personas users journey

Towards the end I was really tempted to fall back onto a more familiar software, sketch and invision. However, I was advise to try Axure out as it is considered “industry standard”.

A lot of time was spent trouble shooting and figuring out what you did right went wrong and what you did wrong… wrong… Being new to a software makes it difficult for you to troubleshoot. Because even if did it right but it is not animating the way you intended it to be, which leads you to think it might have missed a step.

On this note, I am fortunate for the Axure ninjas in class, who spared me some time from their busy schedule and patiently to help me troubleshoot my working file.

Good job! M6elstørm / UXDI 6th ed.

Reflections & Learnings:
- Get to class 30 mins before presentation!!
- Make tactical decisions
- Know when to follow the brief and when to follow your gut
- Have breadcrumbs online on slides to guide audience
- Make it a habit to screenshot before/after interactions
- Provide stats; ratings, clicks, views, durations of stay
- Talk about improvements and further developments
- Articulate on agenda, intent and presentation outline
- Spend more time thinking of solutions vs crafting
- Do competitive analysis, compare aesthetics and stats

Xian’s feedback (Glow and Grow):
• Clear and coherent presentation style
• Especially like the way you presented the prototype
º Some slides were too wordy, be more concise

Wendy feedback (Glow and Grow):
• Love the slides (How did you do the scrolling page
• Concise speech (maybe cos I am a bit flustered)
• Clear presentation flow
º Come in early to avoid being first presenter (luck plays a part too)