ABOUT

IBM Smarter Cities is a project that helps to identify critical challenges facing cities. This is done by putting IBM’s top experts from different business units and geographies into the city to work closely with city leaders. They then recommend how to make the city smarter and more effective.

This project was great to work on because the site needed an updated design and User Interface experience. The first issue I needed to tackle was that when you landed on the homepage you had no idea what the project actually was about. There was also the issue of navigation. You couldn’t go through to the case study on the homepage because the cities were not linked.

I started off by creating responsive wireframes in web flow. With this I could see how my ideas would respond on mobile. I needed to follow the IBM website style but put my own twist on it as I don’t want it to be a duplicate of someone else’s site. I knew I also wanted to introduce the card layout style for the location overviews as I knew it would work perfectly for the case studies when they respond to different break-points.

When It came to starting the designs I wanted to show off the great imagery we had for the cities. When you land on a case study the image is at the top and the first thing your eyes go to. On the case study page we have a parallax scroll to create a smooth flow for the user. I’ve also broken the page into different sections by using neutral and bold colours. This helps to make the page more exciting and easier for the viewer to follow, and not be bored by a page of full text and leave the site.