JESSIE ZHOU
  • ABOUT
  • Work
    • Thoughts
    • Siemens
    • Lakes of Fire
    • YWCA
  • Me without Work :)

YWCA

Site Evaluation and Information Architecture 
​Primary Research - Survey

Project overview

TIME:
Fall 2017

DURATION:
One semester 

​TOOLS:
Adobe Illustrator CC (Wireframes), Adobe XD (Prototype)
​MY CONTRIBUTIONS:
Literature research, User research,  Wireframe

TEAM:
Kaela Disney, Elizabeth Finley, JP Oses, Stefani Sandoval 

PROBLEM

YWCA website is cluttered and unorganized. There is a large amount of information that’s needed and there’s no organized structure or layout that helps users find what they’re looking for.  There is lack of clarity throughout the site and a quantity of tabs in the main site navigation. There is also a lack of knowledge on the user base that currently uses the site. 
​
SOLUTION
We provide to the YWCA prototypes that they could use to guide their process in redesigning their site.

DESIGN PROCESS
Picture
Understand the current frustration that the YWCA users have with current website
Understand what are some effective Information architecture methods we can apply with re-design 
Connect test and research result to our brainstorm, sketch ideas and iteration concepts for  design solution
​Create wireframes and mid-fidelity prototype
​Using desirability and scenario testing to understand if prototype is user friendly and helped with their needs 
PRIMARY RESEARCH

“Sometimes it is not clear what to click on for info or outdated info on website...”

In order to attack the issue they are facing, understanding YWCA website users with their unique view of how the website is used and can provide us important insights into who, how, and why people are using the YWCA WL site.

Therefore, we decided to using Survey and In-personal interviews to help us fill in the gap, and generate deeper understanding of their pain points.
Picture

Picture
ISSUE 1.
​This brought up the point that  YWCA West Lafayette site has poor style consistency, which created difficulty for both new and previous users.



​ISSUE 2.
These quotes reflect another pain point from the user that online registration is not possible for the programs that many years wan to register for.



​ISSUE 3.
One the YWCA site have poor organization underneath them, what you think is under one tab, might be under another. These leads to use confusion when it comes to finding the information they need/want.

​ISSUE 1.
​This brought up the point that  YWCA West Lafayette site has poor style consistency, which created difficulty for both new and previous users.


SECONDARY RESEARCH

Discover more about the company.​​ Understand methods of testing, and other things that might be beneficial to the project.​

Secondary research is drawn from existing sources of information, can be taken from a range of places, for example publications, articles, magazines, conferences, etc. From there we identified research methods such as  Comparative analysis, Heuristic Analysis, Content Audit, Card Sorting, to help us optimize the current site content/information structure. As well as, 

COMPARATIVE ANALYSIS

Other primary websites have aesthetic site layout, consistent site elements, updated content, and clear brand identity.

​One of the first steps in our research process was to assess different YWCA websites nationwide and identify areas that work well for those websites as well as frustrations and usability errors that we can potentially fix for the YWCA of Greater Lafayette.  Our primary comparatives were the YWCA of Houston, YWCA of New York, and the YWCA of USA.
Picture
Current YWCA Great Lafayette site.
Picture
CONTENT AUDIT

6 pages need to be merged, and 9 pages need to be condensed/edit, and 4 pages needs to be deleted.

It is a research method used to collect and sort the current content on the site and uncover the content that is effective on the site, gaps where content must be created or merged, and identifying areas in which content is out of date or no longer useful for the users.  ​
Picture
HEURISTIC ANALYSIS

87 usability errors, 41% of those violates aesthetic errors, 36% violates consistency errors, 8% were mismatched between system status errors.

We want to use Heuristic Analysis to understand, What are the main issues with the YWCA website? Which elements of the interface are most confusing to the user? Are there any major design and usability issues? How can these issues be addressed to enable a greater user experience?  Nielsen’s 10 Usability Heuristics
Picture


​
​Step 1: Problem Scope Definition
Step 2: Decision on the set of usability heuristics
Step:3: Inspection and Testing
Step 4: Severity Rating
Step 5: Discussion of usability issues & suggestion of solutions
Step 6: Defining Terms and Severity Scale
CARD SORTING

Research method used to help design or evaluate the information architecture of a site.

Picture
Picture
In a card sorting session, participants organize topics into categories that make sense to them and they may also help you label these groups.)

​We wanted to use card sort was to help us understand users' expectations and understanding of your topics.  We performed an open card sort where participants are asked to organize topics from content within the YWCA website into groups that make sense to them and then name each group they created in a way that they feel accurately describes the content. We used an open card sort to learn how users group content and the terms or labels they give each category.

WIREFRAMES + BLOCKFRAMES

Picture
Picture

​We came up various sketches based on the four layouts we brainstormed together.  Each follow criteria and theme based on the four sites we looked at before. These sketches are very low fidelity and serve as a starting point as we begin reflecting and pushing towards a more digital representation.



​We then transformed them into block-frames/wireframes, which is the method to emphasize the the structure of the body content.

​It was especially important for us to figure out how the content should be laid out in terms of how we reflected it in the layouts we initially made.

Testing

We expect to have about 10 participants total, plan to test in academic buildings on Purdue's campus and the YWCA building, will be using browsers on laptops to test, and will assess how they complete key tasks on the redesigned interface. We plan to ask them post scenario tasks questions to assess how they think of the tasks and it’s ease of accomplishment. 

​The facilitator will instruct the participant to ‘think aloud’ so that a verbal record exists of their interaction with the Web site/Web application. The facilitator will observe and enter user behavior, user comments, and system action.

After each task, the participant will complete the post-task questionnaire and elaborate on the task session with the facilitator. After all task scenarios are attempted, the participant will complete the post-test satisfaction questionnaire.


HIGH-FI PROTOTYPE
The prototype is a fully functioning interface developed using Adobe XD.  It is to show an exact replication of what the website should look like live.  A link at the end of this section will be available to preview the prototype online to show interconnectivity between pages.
(Click the picture to play with the prototype)
Picture
Powered by Create your own unique website with customizable templates.
  • ABOUT
  • Work
    • Thoughts
    • Siemens
    • Lakes of Fire
    • YWCA
  • Me without Work :)