Archive.org

Project Aim

This project aims to improve the usability of the internet archive tools for use by college students and faculty as a research tool for creative and scholarly research. Specific focus will be given to the search engine and navigation to improve the user experience

RESEARCH

1.

We conducted keyword research on the Internet Archive to narrow the scope of our case study. The website provided abundant multimedia resources for free. Our research aims to determine what the most valuable position of the Internet Archive is and improve the effectiveness of the entire user flow. Using the keyword research tool “SEMrush,” we realized that “Book Download” has the highest monthly search volume. As a result, we decided to limit our design to
searching for a book.

2.

Interviewed the existing user

3.

Created User Personas

4.

Finalized book searching flow

5.

Performed user testing of the current website

6.

Analyzed and short-listed problems

7.

Designed Wireframes

8.

Modified High-Fidelity Design

9.

Conduct Usability Test on High-Fidelity Design

10.

Made changes to High-Fidelity Design

11.

Deliver and Present

Competetive analysis

Key Features

Key Features

High-Fidelity Wireframe

Landing Page

BEFORE

Long lines of text which is hard to read and follow:
According to Understanding SC 1.4.8 from World Wide Web Consortium (W3C),
“For the visual presentation of blocks of text, Width is no more than 80 characters or glyphs (40 if CJK).”

AFTER

Shorten the wording and the length of the notification bar and makes it readable

Two Navigation Bars

BEFORE

  • Provide too many options for users.
  • Confusing and overwhelming to users.
  • Violated the rule of aesthetic and minimalist design.
  • The secondary menu is considered visual clutter, which is known as “noise”.

AFTER - Fat Footer

  • The fat footer can act as a UX safety net.
  • If the users scroll through your entire homepage and are still not able to find what they are
    searching for, the footer can be the last opportunity to capture the users’ attention.
  • The footer can keep the whole website balance and reduce noise.

Two Search Bars 

BEFORE

  • Violated the “Aesthetic and minimalist design”.
  • A webpage is overcrowded with options and this might block users from finding the important things during their quick scan.

AFTER - One Search Bar

  • We included “Scope search” which are the categories, “Book”, Music” etc to limit user’s choices.
  • Hover effect with magnification which is easier for users to know.

Card Design

BEFORE

AFTER

Search Page

BEFORE

AFTER

F Shaped scanning pattern

  • Put the search box where users expect to find it.
  • Users first read in a horizontal movement.
  • Users scan the content’s left side in a vertical movement.

Search Bar

BEFORE

AFTER

Usability Testing

Format:
We conducted a Questionnaire based on SUS (System Usability Scale)
There are 10 Questions with 5 responses in total
Tasks are to find and download a book

Background:
We have 5 users and they are under 30 years old, 2 of them are university students and 3 of them are working professionals.

Feedback:
The feature for filter items is easier to use
The site is Well-organized
Clean and uncluttered.

Can get information quickly
Time on task is approximately 1 minute
Errors are 3 among 5 interviewees

OUTCOMES

While we were embarking on a website redesign project, there were some things we thought about. Questions like: how would we describe the brand? Who is Archive’s ideal customer? What is the main focus of the website? What do we want to achieve through the website? We tried to make changes that make it easier for the users to navigate and use the website. We achieved this by providing as few steps as possible, following a logical train of thought, and providing clear actions for taking the next step.

sasha_loader