Federal Trade Commission
Case Study
Valerie Fedina
PROJECT OVERVIEW
THE PROBLEM:
Overwhelming amount of information make it difficult to navigate smoothly around the website.
THE SOLUTION:
Redesign the website by adding new UI components and colors.
MY ROLE:
UI Designer (Individual Project)
TOOLS:
Figma, Miro, InVision, Adobe XD, Google Drive
User Interface Analysis
Homework 8
PROTO PERSONA
USER PATH
Jared’s identity was stolen while he was in college and, as a result, has become more vigilant regarding fraudulent behavior. The FTC website provided him sound advice that helped him rectify his own challenges with identity theft. He now visits regularly to find resources to help his family and friends stay safe. Jared is an In-House Counsel for a fortune 500 tech company based in D.C. and he regularly visits the FTC website to review news and cases related to his company’s industry.
USABILITY TEST + INTERVIEW NOTES
TASK 2
TASK 1
TASK 3
Can you find the Press Release for the most recent Facebook case?
Can you find the most recent case regarding Facebook?
Can you find the Blog Article "Aiming for Truth, Fairness, and Equity for Your Company's use of AI" from April 2021?
Affinity Diagram
Prioritization Matrix
Affinity diagram helped me to sort user testing information.
Prioritization Matrix helped me to prioritize information on the website that important for user and stakeholders. Full Matrix.
EMPATHY MAP
REDLINE
03
01
02
04
05
06
Main Navigation Submenus need to be clear and understandable why they are located in specific category.
Search bar needs filters
"I would like to..." is not a comprehensive list of actions available within the site. In fact, the majority of links lead to external sites.
Filters should be on the top of a page
Sections from the top bar repeatable on each page (on the left side) and on the footer. We can add pictures instead of the heavy-text
"Contact Us" title is not noticeable. Should be separated from the address so it is clearly seen.
USABILITY WEBSITE NAVIGATION TEST
USER 2
USER 1
USER 3
“Based on search results, you can read about the act, but can't tell if any of the links are actually the act”
“On website like this, the search bar should include advanced filters option”
“It’s very confusing where to begin”
CARD SORTING
SITEMAP
Prototype of Desktop Navigation
HOMEPAGE
BUTTON STATES
Information Architecture
Homework 10
Iterations
After the User Testing UI designer iterate the footer, header, search bar, colors, and hovering option.
UI Style Tile
PROTOTYPES
Responsive Design
Homework 11
UI STYLE GUIDE
Style guide created to show how the UI works across screens, what the responsive UX is, illustrate sizing across screen states
Interaction Design
Homework 12
USABILITY TEST PLAN
USER TEST + NOTES
USER 2
USER 1
USER 3
Likes that logo navigates you to the homepage. Also likes that primary navigation and footer reflected on all pages. Would love to see the final result.
Likes color palette. Thinks that blue is a strong color for an agency like this because it gives the user a serious and helpful tone. Easy to navigate through the pages. Likes how social media is reflected on the footer.
Thinks that homepage should and cloud have more information, like take action. Likes design and how information grouped. Easy to use and not confused at all.
FINAL PROTOTYPES
FINAL THOUGHTS
GROUPING OF INFORMATION
RESPONSIVE WEB DESIGN
The sorting of information is an important part of the redesign. Government websites have a lot of important information which users can find easily, so we exert every effort to make it clear and simple to locate the information.
Following user testing results, the users prefer to use a mobile device towards desktops. RWD is important for a brand because you cannot tell which device the user will be using for your product. As a designer, you should bring a delightful experience and convenience of usage.
THANKS
UCF BootCamp Challenge’2021
Valerie Fedina