Project Overview

An opportunity arose when I got asked by the Stratford Police Services to suggest a re-design their maturing website. I, along with a team of some other classmates (Seul Lee, Savannah Pluzak, Subul Wasi, and Rory Whelan) worked together to propose a more modern, contemporary design of the Stratford Police Services website.

 The focus of our re-design was to communicate the easy access and availability of the service to the Stratford community.


Meet with Client and Research/Analyses

A meeting with the project client (Stratford Police Services) helped to define the course of our project. It gave us, as outsiders to the client's service a better understanding of the needs and goals the re-designed site should intend to address.



 A client and competitive analysis, as well as a website design audit was completed to help us determine how the Stratford Police Service's website compares to others in its same field, and help to define what the strengths and weaknesses are of the current site design.

User Personas

I and my team members developed user personas that: 

  • Represent a major user group for our website

  • Express and focus on the major needs and expectations of the most important user groups

  • Give a clear picture of the user's expectations and how they're likely to use the site

  • Describe real users with backgrounds, goals, and values

Brainstorming and Sketches

 As a group, we brainstormed and made a list of free-associated words and phrases related to the goals, aesthetics, etc. of the project and everything that came to our minds when thinking of the Stratford Police Service.


To quickly explore concepts and work out new design ideas, each group member was also responsible for sketching out their ideas for particular pages of the website.

Site Flow and Wireframing

I created a new site map for our redesigned site. This assisted us with organizing and clarifying the content that needed to be on our site, as well as assisted us with eliminating unnecessary pages.

I developed wireframes to allow for the clarification of website features and more importantly, to push usability to the forefront in showcasing page layouts at their core. From the wireframes, we were able to point out as a group the flaws in our site architecture and how specific features may or may not work.

Style Tiles/Mood Boards

Three different mood boards were established for our design. I created StyleTile Version: 1. I used these mood boards to help me narrow down the visual design strategy I would use when designing the website.

Final Designs

See a sample of pages I designed for the re-design of the Stratford Police Services. 



Role: UX & UI/Visual Designer (Group Project)

Created using Adobe Illustrator

© 2016 Janelle Williams. All Rights Reserved.

  • Black LinkedIn Icon
  • Black Instagram Icon