© 2017 Cally.Design

Jamie

Age: 24
New IBMer

Ottawa Lab

The Personas and Hills

Age: 47
Long time IBMer / Manager
Toronto Lab

We started with the creation of two IBM personas, a new hire in Ottawa and a long time IBMer in Markham. Through this we were able to pinpoint user frustrations with the current site. Through the personas we were able to defined the Hills and organized user journeys. The next step was to host a Hackathon within IBM, and to gather the ideas of other IBMers on where we should be going, what they want to see, and what they want the site to look like.

Brad

IBM Upcoming events was a completely new section I decided to add into the site. I was hoping with more events showing up in an easier to access spot people would be more inclined to participate.

 

This presented challenges when moving to mobile, how would the calendar change to show events on such a small screen? The final product gave an area to go where you can keep track of events and attend easier than before.

After getting approval to go forward with the design, it was time to work on a homepage that worked well across numerous device types.


This included making changes to the desktop design as to not confuse mobile users - such as changing the emergency slider to a banner across the top. Through feedback sessions we realized the slider on mobile looked like a notification that something had gone wrong. So we placed the emergency procedures beside quick links and moved the banner up to the top. This would only show if there was an emergency at the lab.

Mobile Friendly

The First Design

After reviewing all the findings of the Hackathon, as well as going over the needs of our users, I was tasked to design a brand new concept for a site. One that not only looked modern, clean, and intuitive but also was easy to upkeep. I created a few iterations before showing the Canada lab Director and finally agreed upon this:

After a quick playback with our stakeholder we received approval of the design and to continue going forward with the rest of the site. We were challenged to design a site which worked across numerous devices, so that was the next step.

Old Canada Lab Website

Canlab Homepage

After getting approval to go forward with the design, it was time to work on a homepage that worked well across numerous device types.


This included making changes to the desktop design as to not confuse mobile users - such as changing the emergency slider to a banner across the top. Through feedback sessions we realized the slider on mobile looked like a notification that something had gone badly. So we placed the emergency procedures beside quick links and moved the banner up to the top. This would only show if there was an emergency at the lab.

A new lab employee can find lab community information and orientation tasks all in one customizable place

A long time lab employee can find resources to help complete routine tasks and professional development all in one customizable place

Hill 1

Hill 2

In August of 2016, we gathered a team to partake in the daunting task of redesigning the internal website. The current website at the time was dated, not mobile friendly, and had plenty of broken links. We started from scratch, held research sessions, hackathons, and the like to get a solid idea of where we

were going.

 

Was this site going to have an audience when released? Why do people even use the Canlab site? What can we add to it to increase our audience?

Findings from Hack The Homepage

IBM Upcoming

Events

Proposed New Concept