Redesigning OneAston's website

OneAston/ Desktop and Mobile Site
Length

8 -9 weeks

My role

UX/UI design, brand design

Team

3 designers
1 PM

Deliverables

Desktop + Mobile website

Tools

Figma, Webflow, Google Analytics, Hotjar

Client and brief
OneAston is a B2B company offering IT solutions. My team was tasked with updating the look, feel, and brand of their website in a 8 week timeline.

My role as main designer was to lead the visual design and build it on Webflow. The other designers designed layouts and illustrations, and helped with backend troubleshooting.

Process

OneAston/ Website redesign
highlighting areas of improvement
OneAston’s legacy site had an outdated brand and UX problems like the site’s information architecture not being user friendly. Our team’s first step was pointing out these problems and suggesting room for improvement in a Figma file.
After identifying problems we carved out the website’s content IA with the client.
...and turned that into a easy to see flow.
I gathered competitors’ websites ideas to show the client to see what style direction they liked and what they didn’t like.
I also gathered different photos and imagery directions and got feedback from the client.
I created different versions of different styles of the look and feel of a site, based on examples of existing companies, to get more in-depth feedback about colours, typography, and images
We moved on the nittier details like defining spacing and border radius, and typography.
For selecting type, we selected typography that represented professionalism and modernity, and which were scalable. We ended up with Inter for body and Epilogue for title, then set the scales for both desktop and mobile.
I created a flexible colour system with 7 shades of each hue, with the primary being blue and also defined accent colours and states’ colours
We also created a buttons, links, headers and footers to give ourselves more flexibility if we needed them later on.
We jumped into iterating ideas of how the home page will look like. We spent the most time on this page because it attracted the most traffic.
Following client feedback, I kept iterating on more ideas for the hero splash.
...and did the same for the other pages like About, Success Stories. We made used for Webflow’s CMS tool and built a CMS template for pages like success stories.

Outcome

Rogers/ Desktop Site
After 4 weeks of design we got approval for the final designs. I then built it on Webflow, where the team and I also added elements like hover effects to make the site more interactive.

We ensured that we designed popups for cookies opt-in/opt-out, and for GDPR compliance. We also plugged the site onto google analytics to track site traffic.

The development phase stretched for another 4-5 weeks, with 1 week used for back-end fixes like connecting the domain.

The website is live on www.oneaston.com