Atlanta.gov
On the path to bring all services available online to citizens. By adding a feature to a product.
Overview
Atlanta.gov is outdated but they want to be more modern and citizen-centric they want to provide citizens with their own logged-in environment where they can see everything related to their governmental interactions.
They are looking for a responsive design that embeds perfectly within their current site and can be eventually used for other services that go online. Together with this new fully-online service, they want to also prepare a logged-in environment that would not only allow for all information to be in one place, but also reduce bureaucratic hassle.
How might we increase Atlanta.gov reach to its customers with a better online presence?
Solutions
• Creating a responsive website with necessary features
• Finding what customers value so we can continue to be able to build loyalty but still excite
What Did I do…
UX / UI Designing. Research.
Scope
Adding a Feature. Web App. Branding
How long did this take…
4 Weeks
Tools
Figma. Pen & Paper. Adobe Illustrator
Understand the need of the user
(Empathize)
Have to apply for a birth certificate? Report a 311 issue? Before looking this up going to a government site, that his outdated is daunting. Government institutions are falling more and more behind when it comes to the digitization of their services. These institutions are traditional, huge, and slow. Every procedure and services are prone to tons of bureaucracy, involving many parties and many steps. Everything has a paper trail, making it tricky to move such a big ship into digital waters. So we start with a research plan.
As with the previous projects I also did market research, to get a deeper understanding of general government users and a better understanding of the current trends within the municipal service site. My mission was to hone in on the market as well as record any facts, statistics, or trends to further my support of research for usual government site users. Through this I found out that 46% have looked up what services a government agency provides, Americans tend to interact with the government using a mix of online and offline methods. Internet users prefer contacting government online, but the telephone remains a key resource for government problem-solving.
Here are a few trends I saw through my research
• 48% of internet users have looked for information about a public policy or issue online with their local, state or federal government
• 23% have gotten information about or applied for government benefits
• Online Americans typically rely on search engines to guide them to their destination when seeking government information online
• 28% of baby boomers report having some kind of health problems, disabilities, or handicaps that keep them from doing certain activities—as a result, they report being less likely to use a variety of digital assets and devices such as the internet and smartphones.
• 46% have looked up what services a government agency provides
Empathy Map (Insight and Needs)
In order for me to gain a deeper insight into the user interviews. I analyzed all the data from each session and put onto a Empathy Map. This allowed me to synthesize information from the reviews and also extract the user needs and insights that would help in adding a feature to Atlanta.gov. View the Map
INSIGHT
Don’t rely on the government sight to give concrete information
NEED
To have a site that has concrete information
Competitive Analysis for Atlanta.gov
After I getting a better understanding of which government site works and is set up in regards to user trends. The next step was to compile a competitive analysis of government site space to understand what business and brands are doing well and where they’re flaws are. Doing this allowed me to create a business strategy where Atlanta.gov can succeed and avoid.
Most of Atlanta’s competitors had much more strengths than weakness as far as their information architecture—the navigations are clear and up-to-date .
Create User Personas
From our Empathy Map and Research Findings I was able to create a semi-fictional character, Lanier. The persona is the result from qualitative and some quantitative user research. Creating Lanier, helped me to stay user focused throughout the design process, and untimely thinking, “is this helpful for Lanier?” View rest of Empathy Map
Define the problem to leading to an excellent solution
(Define & Ideate)
Following the methodologies of market research to get feedback on current users of government sites and observe how people get to the service they need and competitor analysis, to evaluate current competitors strength and weakness and how Atlanta.gov can plan to fulfill their citizen needs. As well as, conducting interviews through Skype and or Google Hangouts with participants by asking questions about their experiences. Informing me with detailed information about their attitudes and desires.
To define the problem, I crafted point-of-view Statements and “how might we” questions to have clear, actionable problem statements.
Once the POVs were established, I was able to pose hypothetical scenarios for how I might solve each one by brainstorming, you can see my mind mapping here. But I had to bring out my organization and leadership skills with hosting a Group Brainstorming which was very successful at bringing up more ideas.
Project Goals
With user research being completed. I created project goals that encompass what the business wants, what our users need, and what are the technical requirements. My first step was to identify business and user goals in regards to what aspects they share together. I did this so I can have a strong foundation of what needs to come ahead throughout the project duration.
Product Roadmap
To develop key elements that should be included in my product’s design and to know as a UX designer on the team, that I can help with suggestions and ideas from my user research. I referenced the example given then sorted out what are the features that I need or wanted to have based on my competitive analysis, and project brief listed them as shown. View Product Roadmap
Web map
To further Atlanta.gov information architecture. I created a sitemap. This Site map worked as a scaffolding for the site, and It allowed me to maintain the platforms structural integrity before I started designing the internals of how Lanier will go through the site. Until one session with my stakeholder, where it was pointed out whether I was doing a mobile or web app (decisions, decisions) having initially no idea what a web app was (still trying to understand it.) I’ve created my web map.
Task + User Flow
From the Sitemap I wanted to get a better understanding of how users will navigate the platform and interact.
Task Flows are created so I can gain a step-by-step analysis of how a user will interact with a system in order to reach a goal. This analysis is documented in a diagram that traces a user’s possible paths through sequences of tasks and decision points in pursuit of their goal.
User flow allows me to see how users possibility in navigating the platform when given different scenarios and tasks to complete. This is to open my mind up to different avenues that the user portray these possible patterns in a way that makes it easy for me to assess the efficiency of the interface making sure the user's time isn't being wasted looking for what to do next.
Take a look at the full User and Task Flows.
Mid-Fidelity Wireframes
This was process that has continued to be revised. How components make sense for our user. Is this needed? To be able to integrate the added feature to the web app, test my design and make changes accordingly before jumping and building my high-fidelity wireframes. I continued to reference my competitors flow the welcome site and build off of there for the web app and same time understanding the functions of a web app and prototyped accordingly based on the task flow. View extended Mid-Fidelity
TASK 1
Find how would you be able to report a pothole issue through 311 portal
TASK 2
How do you go to apply for your birth certificate
TASK 3
Log in to view your requested birth certificate status
Creating innovative solutions
(Prototype)
Is the dashboard worth it ? To some maybe not but as a development process with creating more personas as a wider net to someone who does frequent their government site. I have grown to believe that this is necessary, to create a hub where our user won’t become frustrated with using something that should be up to date with the times.
Usability Test Plan
With my Prototype linked and ready, it was time for me to send out to new participants. I used Usability Testing Guide to validate or invalidate any assumptions I had during my design process. I observed participants patterns and habits, and doing so allowed me to assess any areas of confusion and uncover opportunities to improve the overall user experience.
Based off of my Usability Test plan, followed by using evaluative research and think aloud testing to observe how participants interact with the platform when given scenarios and tasks to complete.
Take a look at the full Usability Test Findings.
Participants
• 4-8 participants
• Men and women within the target demographic, age 25 - 50
• Participants who have experience in searching for government services online Usability Test Findings
To document how users go about completing tasks given to them in order to improve prototype. I stuck to my script and re-listened and reviewed my notes taken during the different sessions.
Affinity Map
Just like an Empathy Map is to User Interviews. We created a Affinity Map after conducting our Usability Testing. In doing so we are able to gather a significant amounts of data and organize them into groups or themes based on their relationships to: patterns, habits, and insights when it comes to improving the platform. Take a look at the full Affinity Map.
Insight
Most Participants appreciated the clarity is helpful, elements that made sense were easy to get to
Recommendation
Building out icons as well as additional feature and task needed to be seamlessly built out
By moving forward, I’ve taken into consideration the results from my usability testing and revised the following as far as my insight goes.
• My first round at layout everything, I wanted to let the user know what was available on their dashboard as a citizen.
And to think, I was about to settle. After reviewing with my stakeholder, the previous wasn’t balanced and neither was this.
• My coloring had improved (I didn’t realize my brand blue wasn’t at it’s full saturation), my grays had to be adjusted and my calendar needed some work.
Is it the final? Maybe. Third time is the charm? Who knows!
• After going back and making everything consistent. The stakeholder was much more please with the submission.
Branding
Having my low-fidelity frames still empty it was time for me to start working on Atlanta.gov’s branding.
I started by creating attributes that represent Atlanta.gov which is: boundless, cultured, timeless, trustworthy, modern and classic. From the attributes I created a mood board on Pinterest that represents Atlanta.gov in the features of typography, colors, layout, and logo. This gave me a point of direction when it came to Atlanta.gov’s visual design.
High Fidelity Wireframe + Prototyping
In combining my Style Tile and the Low Fidelity Wireframes this has shaped the High Fidelity Frames that are prototype ready. Now having my High Fidelity Wireframes completed I was ready to start compiling my frames into a working Prototype. I used Figma’s wireframe by creating the clickable prototype.
What I Learned from this Project
This project was a learning process of understand what I was even doing with adding a feature, especially to a dated government site. But it has exposed about the challenge of fixing something that is heavily daunting to the general public in addition to going back if I misunderstood something. This will take extensive working on and I definitely cannot do this alone. With that said, I feel like it was exciting to take a challenge like this and start the base work of making it better and functional for the public.