Our team explored the current usability problems of the GeekWire app and suggested recommendations for improvement. We redesigned the Android app based on research interviews of Geekwire users, and reorganized the content to allow easier navigation, searching for articles, and improved the ability to share those articles.
Duration: 2 Weeks
Visual Design Lead
Information Architecture Lead
The GIF on the right shows our solution in action, including the menu, the ability to search for an article, and the ability to share articles. The sections below will illustrate how the team and I made the decisions that went into this prototype.
GeekWire is a fast-growing, national technology news site with strong roots in the Seattle region and a large audience of loyal, tech-savvy readers around the globe, who follow the site for breaking news, expert analysis and unique insights into the technology industry.
GeekWire Desktop Site
Those that regularly use the GeekWire app like having quick access right from their home screen, the ability to set up push notifications, and the customized GeekWire experience.
Most sections of the Android app are more difficult to use than the mobile website. For many users, it is easier to access the content right from their mobile browser, without having to download an app.
James, our research specialist conducted screener surveys and interviews with people who keep up-to-date with tech news, particularly in the Seattle area. From the results, we were able to put together a persona that reflected what those interviewees' needs and goals are.
After poring over the interviews, the next step was to distill that information into usable data. As a team, we found patterns the users had in common. Below are the relevant takeaways from that process.
Our persona, Scott T, was built based on our takeaways from the interviews.
When it comes to news apps, the users need to be able to trust the source. This means a clean looking, usable experience with no low-quality ads.
Our interviewees ultimately cared about the news stories. The easier it is for our users to get to the content, the better the experience will be. Everything else is secondary.
The people we interviewed often mentioned sharing links to articles with friends or on social media. We kept this in mind while deciding what features to focus on.
The Android app keeps their content updated the same as their desktop site and has a straightforward approach to their home page with the most popular articles featured.
The drawbacks to the app is that it has a convoluted menu, hard-to-read articles, and lacks the ability to search for articles, making the product difficult to use. My team focused on improving all of these factors to create a useful and hassle-free tech news experience.
While the home page is straighforward, it looks dated, the amount of content is overwhelming, and the hierarchy of content is not easily understood.
The menu simply has too many categories that are listed alphabetically, with some being fairly ambiguous (bot or not), and some that are out of date (app of the week).
Yes, this is the standard view for some of the articles, making them practically unreadable. It shows that the content was pulled from their news feed, but no effort was made to format it correctly.
While the team had a lot of ideas on how the GeekWire app could be improved, we had to keep in mind what could actually be done in the limited time we had. Sitting down to compare the importance of each feature against how difficult it would be to implement helped us decide what to work on.
To explore as many perspectives as possible for solutions to our user's problems, everyone on the team participated in a design studio. Our individual contributions resulted in a mix of confirming individual thoughts and new concepts.
I took the ideas from the design studio session and translated them into digital sketches using Procreate for the iPad. Included below are the home page, the menu, an example of the article page, and the search results page.
I was tasked with converting the sketches into a digital prototype using Figma. This was my first time using the program, so naturally there was a little bit of a learning curve. The ability to collaborate on a project and add interactions really helped us communicate and share our thoughts on the design.
The home page has been redesigned to group the articles into categories, with the ability to highlight more popular stories with sizing and images.
The menu underwent an overhaul thanks to our information architect, Jayne. She went through the types of articles Geekwire posts and grouped them into more manageable categories.
Since our users liked the ability to share articles, we made sure to include a share feature at the top of the article for those that searched for it specifically, and another one at the bottom of the article for those that liked what they just read and wanted to share that.
Our research lead James offered free snacks to local coffee shop patrons to test our prototype. We were able to get some good qualitative data about how people felt about the app and how easy it was to use.
We used a product called Maze to collect information about the tendencies of our users and the usability of the prototype. This gave us more quantitative data on where the biggest pain points were and what people had problems with.
The biggest pain points for our users were:
The heat map shows the where users tend to interact with the page
While separating the articles horizontally might work for newspapers and desktop sites, our testers couldn't easily reach every article with their thumbs. The layout has been updated to extend to the edges of the screen, allowing content to be accessible from both sides.
Some of the people testing our app didn't realize the menu scrolled. Each row was shortened to allow the bottom row to peek up from the bottom, indicating more content below.
Sometimes you have to admit an idea is bad. Our original search results page just ended up confusing our testers, so most of the work was focused on redesigning this section of the app. It is now separated by category, and the other sections were updated to more appropriately reflect what people search for.
The final prototype incorporates the changes made from testing