Project Description

Challenges

The previous site contained nothing that the team liked. They felt it was old and difficult to navigate. The site simply wasn’t living up to its purpose which was to be a conduit to allow the city to connect, inform, and educate the community about the city and its programs. El Segundo has a lot to offer and wanted to showcase that in the new site while making information easy to find.

The homepage uses a lot of real estate for the news stream.  Images are small, the text is misaligned, and lacks hierarchy. The main navigation is being overpowered by the list of links in the first column of the site. Lastly, there is no quick and easy way for the community to make a payment, fill out applications, research permits, or request planning and building plans.

Discovery

During the discovery phase of the project, we collected data from various research methods. The stakeholder survey was sent to the client as one of the very first deliverables. Survey results gave us insight which enabled us to make informed decisions. 

The community survey targets the community to find out what’s important to them. We collected unbiased data from the previous site and made a report based on the data we reviewed. We calculated the sample size of the population to reach statistical significance. We were able to gather data from 700+ individuals. The organized report summarized the community’s feedback and highlighted major pain points.

We used google analytics to analyze the behavior and trends of people browsing the site.

We used a web analytics tool to generate heatmaps. I ran the experiment for 3-4 weeks and produced a heatmaps report that covered how users are interacting with the homepage. As a result of this study, paired with data from analytics, I was able to uncover which sections of the page that are working well and which sections could be improved or omitted.

I conducted remote usability testing with five users. I wanted to test how well users interacted with the site when tasks to find information. During this study, I focused on the areas users get frustrated with, which parts seem to be confusing, and when and why they abandon a task. If users are particularly vocal (which I encourage), we can gather information on architecture efficiency, layout acceptance, commentary on content and design.

Initial Wireframe Options

After conducting studies and synthesizing information, I created initial wireframes with the help of another UX Specialist for the upcoming UX Workshop. We created user flows, sketched wireframes, and did a couple of card sorting exercises to help structure the content of the site.  

During the workshop, we presented study conclusions and constructed a wireframe solution with the team at El Segundo. We tested the wireframe and the results were a success. There was a minor change to the wireframe that resulted in the switching of two sections but El Segundo's team was very happy with the results from testing the prototype.

Users utilized call to action buttons for quick tasks. The new structure of the navigation made items easier to find. Testers loved how interactive the service finder was and how it pointed them directly to the information they were looking for. The Business, Residents, and Visitors cards provided quick access to frequently asked questions divided by demographic. With a solid foundation, the visual designer was able to add a lot of flair to the wireframe to create a beautiful end product.