High fidelity mockup of the final design
The Prototype
Our Challenge
My team was tasked with designing a better experience for New York City citizens who need to be able to access information about their local government and its services within a 5 week timeframe. We were given the freedom to narrow in on an area of the city government, research, and create a solution based on that.
Where Do We Focus ?
With the problem space having such a broad scope, I aided my team in conducting Both User & Subject Matter Expert interviews in order to identify a potential opportunity space. We spoke with 4 Government employees as well as 6 everyday citizens in addition to attending 2 Community Board meetings in an effort to focus in on our issue. Through interviews we discovered the following
We discovered that the citizens we spoke to in our research interviews frequently rely on multiple outlets to keep in the know of current government news. Using these varying sources means that users have to spend excess time and energy in order to find news on things pertinent to them. I recognized this need presented an opportunity in that whatever solution my team creates, it should have a way to streamline news & relevant updates for the end user.
New York City Websites
I then aided in the team in conducting an audit on multiple New York City Websites including NYC 311, NYC.gov, and multiple Community Board Websites. From this we learned the following
Website for Community Board 4 which does not utilize the redesign
Official City Website using redesign by HUGE Inc
The Competition
After conducting research we proceeded with a competitive analysis of the Yelp, Twitter, Citizen, & Nextdoor platforms. We chose these particular platforms because they each aim to deliver relevant information tailored to the user and act as a place to follow things they deem important. We also wanted to examine how they deliver this information and how they each handle tracking of topics.
Social media competitors we looked at
What they do well
These services allow for fast updates on a range of topics and officials like celebrities and mayors for example. Twitter, Nextdoor, and Yelp also allow for community interaction by allowing communication between users and establishments/ officials. I also saw that a trending topics section was prominently featured.
What they don't do well
Most of these applications serve as social media and are not directly connected to a government agency which means you will still have to use another source to maybe find what it is you're searching for. No service really acts as a centralized device for communication between the community and local government. This means users will still have to keep track of multiple sources and since none of these of these applications are directly tied to government they still end up redirecting you to one of various city websites that may or not be capable of delivering a satisfactory experience and actually helping users accomplish their goals.
Struggling to Decide
My team and I had the good fortune of being blessed with great interview participants and a huge amount of data. So much so that we began to struggle with where we should focus on the problem from. A large portion of our data had come from government employees which made us think about possibly creating something that addressed the needs of those employees however we were not as knowledgeable in the government side of things and time was a constraint. Would we be able to conduct all the necessary research and learn everything we would need to know ?
We decided to focus on the everyday citizen and help them more effectively track their requests and complaints issued to the government.
An affinity mapping session we conducted in order to make sense of all the information discovered
Synthesis
I lead my team in both the aforementioned affinity mapping exercise and in the creation of the Kevin Williams Persona. We went with a persona as we felt that it helped us best maintain alignment with the needs of the users. With this persona we made sure to include the most common pain points, goals, frustrations, and motivations our users stated during research.
When Out of Nowhere !
My team was set to begin drafting concepts when a new competitor was found and threw a wrench in our plans. This competitor, SeeClickFix, does exactly what we’d decided was our opportunity space. They allow you to easily see the progress of a request, who's addressing it and the estimated date of completion as well as any accompanying data. It engages the community in improving the city, helping them play a more active role in bettering where they live. Since we had so much data and various avenues of approach for solving the brief we decided to pivot. We now aimed to deliver a product that would help users be in the know about community topics important to them and also help them be more engaged while still working around their busy schedules.
Brainstorming Concepts
I lead my team through multiple rounds of brainstorming in order to begin crafting potential solutions to address the needs of the users. We settled on 5 concepts which each attempted to tackle the problem or a portion of it. These concepts were then tested with our users, some of whom are recurring from the first round of research interviews. I, along with my team tested the concepts in order to identify which would resonate most with users in solving some of the pain points that were discovered.
The testing participants made note that some of the concepts seem to fit inside the dashboard website concept I put in front of them. I took this into consideration when converging on our designs in order to proceed with a unified solution. After conducting a team meeting about this we decided upon on a personalized dashboard feed tied to the Community Board they reside in. This would allow them to choose topics that matter most to them so they can be alerted when there is a meeting or update about. I suggested that we focus on a mobile form factor because users did mention being pretty busy and would like to have the capability of keeping up on the go. This would slot right in perfectly with how people already access some of their news.
The Community Board Redesigned
Site Map
I led the collaboration session with my team with the goals of laying out a site map and understanding the flow/layout of the product. This helped us in understanding where to put what which is something that is even more important for a government website considering the amount of information present. Below is our site structure.
The Wireframe
Our product is a community board website redesign that is catered to the user’s preferences. A personalized feed that automatically identifies which community board you belong to based on the information entered in the Sign Up Flow. Below are sections that address some of the common points we heard about.
The Results !
Overall the tested users had a positive experience with the redesigned feed. They all felt that having something like this available to them would really allow them to be more involved in their community they also felt everything was easy to navigate and that the text was not confusing which, for a government site, is an accomplishment !
However nothing is ever perfect and we still had some work to do. One big thing that caused some users to hesitate was that they were unaware why we were asking for their personal information for account creation. They, understandably did not want to just give out some of their personal information. These were the issues we had to sort out :
- Users need an onboarding explaining why their info is needed so that they will feel comfortable proceeding
- Focus on privacy in the onboarding flow
- Follow more conventional design paradigms with iconography used to indicate available actions
The "Final" Product
While I say final, I mean final iteration possible in the time we had left. Below were some of the iterations we made in order to address the feedback gained through usability testing
Wireframe Prototype Link : https://invis.io/KPVB8696NFX
Updated the like and dislike icons to conform to standard conventions
High Fidelity Examples
Above are two examples of the high fidelity prototype I designed for this project. The colors, font, and overall feel are derived from the HUGE Inc. redesign of New York City websites. I strived to create a sense of uniformity with the updated government websites. I want users to know they are still on an official government website and want to have a sense of familiarity if they've used the desktop. Unlike other products where I tired to be creative in high fidelity, I really wanted to have the experience solve the needs of the users and then have the UI design be complimentary and utilitarian.
What does the future hold ?
Due to limited time my team and I were only able to take this design so far but given more time and resources we would have tackled the following :
- Test Sign Up/ Onboarding flow for user privacy concerns and conduct further research and testing for this flow specifically to ensure maximum user completion rate while also truly safeguarding their private information
- Consider research and testing into different verification methods that identify the user as a real person in the city area and not a bot, spammer, or troll but someone who really would like to participate in community affairs.
- Place measures that ensure that ensure users will cast an educated vote.
- Carry out the redesign to a desktop setup and also consider the viability of a mobile application
