BANSARI SHAH
Design Challenge
User Research
Process
Initial brainstorming
Short-hand notations of the flows
Redesigning
multimedia.csueastbay.edu
Vision
multimedia.csueastbay.edu is a website for the Multimedia department of California State University, East Bay and it is accountable to give information about the Master's program in Multimedia Major. It focuses not only on the aspects and prospects of Interaction Design discipline but also helps users to run through the whole application process.
Design Challenge
The design challenge of this project was to develop and design a more user-centered experience for users to easily navigate within CSUEB’s Multimedia Graduate program website.
Team
Jinthana, Jing, Bansari, Jonathan
My Role
User research, Heuristic Evaluation, UX Design, Wireframing & Prototype
User Profile
Who: Our target audience will be the people who generally completed their University Diploma, and interested in pursuing the Interaction Design. People age from 18-50 whether having interaction design knowledge and or not. People who have got experience in the computer industry, digital media, multimedia discipline or Information designing.
What: Multimedia Master Program Website. It gives comprehensive information about the requirements and benefits of this Interactive Design Master Program.
When: Anytime can be accessed with the internet on any smart devices while looking for a master's program. Most likely as a result of seeing programs in interaction design.
Where: This website is online. It can be visited by smart devices with the internet required. It can be found in the list of schools or programs related to Interaction Design or Multimedia major in blogs or educational websites.
Why: The audience is curious about the Master Program in Interactive Design at Cal State East Bay University, and is curious about the requirements or costs or even the course roadmap. This website can be a great source to find out the future scope of the Multimedia or Interaction Design program.
Design Criteria
The main design principles we aim to focus on is layout, contrast, color, and content. As a team, we decided that these were the main design principles that we wanted to focus on because these stood out to us the most of what could use improvements.
-
Easier Navigation: Create a more efficient layout where users will not be overwhelmed with information on a page. As a result, the bounce rate can be decreased and users will be more engaged within the site. Our focus is to develop a design where users can easily access certain information they are looking for.
-
Creating Contrast: Develop a design where information, images, and text are placed next to corresponding information. Nothing should clash with each other and information is placed with thought rather than placing information just to place them. Our focus for this principle is to make sure we develop a design element where everything is in the “right” place.
-
Make it meaningful: Design a website that uses specific colors to tell the story of what we are trying to communicate to users which is specifically the Multimedia Graduate Art Program. We want to focus on choosing what colors would work with each other while also using the right colors to tell our story.
-
Make it informative: Include content on the website with the purpose of giving the context of proper information instead of dead links so that users will get the awareness of what the program is offering, what is the upshot of the program, what previous students have done in the program.
Success Metrics
Increase:
-
Traffic - Prospective Students: The focus is to increase the number of students that apply to the Multimedia program or students who are interested and use the contact page to contact the art department for more information; making sure to gain an influx of new users as well as existing users.
Decrease:
-
Bounce Rate: The rate at which people or users leave the site after only visiting one page; we want to decrease the number of users who leave the Multimedia site after just visiting one page without viewing other pages. (We can reduce the bounce rate by keeping users more engaged by using more visuals, less text, proper categorization, and making the site more interactive.)
Deliverables
Objective: To increase website users.
KPI: Users Growth KPI.
Definition of the KPI:
-
To encourage users to visit the website and reduce the bounce rate
-
Achieving this target will allow the department to have more students for the Master’s program
-
Progress will be measured as an increase in the number of users and a decrease in bounce rate
-
By providing the required information, by engaging existing users to explore more website
-
A project supervisor is responsible for this metric
-
Users to visit the website will be increased from the total number of 154 and bounce rate will be decreased from 65.7% to 30%
-
Progress Will be reviewed on a weekly basis
UX Deliverables
User Research
The user research process was divided into four steps.
-
The first step was user interviews as different users were the key to find out the use of the website and the pain points of the website. As a member of a team, I did user interviews of different types of users of the website.
-
The second step consisted of personas and user journey map creation according to the responses given by the users. I created the user journey map, personas according to the feedback of the various users.
-
The third step was very important as it was specifically dedicated to google analytics analysis of the website using different constraints. I went through the analysis of Google Analytics to get information about the amount of different kind of users and the medium to be used to explore the website. Google analytics helped me to understand the reasons for a bounce rate and sudden dropoffs.
-
The last step included the Heuristic evaluation of the website according to an easy to use usability engineering method designed by Jakob Nielsen in 1994 to find usability problems in user interface designs.
All the members of the team finalized the scale of 1 to 4, where 1 is the most severe problem and 4 is the most satisfying finding. With the help of this scale, we performed individual analysis of each of the ten heuristics and tracked the adherence and violations of each.
Heuristics Used:
-
FEEDBACK: Visibility of system status
-
METAPHOR: Match between system and the real world
-
NAVIGATION: User control and freedom
-
CONSISTENCY: Consistency and standards
-
PREVENTION: Error prevention
-
MEMORY: Recognition rather than recall
-
EFFICIENCY: Flexibility and efficiency of use
-
DESIGN: Aesthetic and minimalist design
-
RECOVERY: Help users recognize, diagnose, and recover from errors
-
HELP: Help and documentation
After discovering the findings having 2 or less than 2 scales, we figured out the solutions from exiting sources which could be incorporated in our solution.
Goals
(Initial Brainstorming)
Short-hand notations
(Short-hand notations of the flows)
Flow-charts
(Lucid Flow charts)
Task-flow
(User Task Flow: To apply for the Multimedia Program)
.png)
(User Task Flow : To see the overview of Multimedia program)
Low-fidelity wireframes
(Low-fidelity wireframe)
To reduce the bounce rate and engage users to explore the website, we tried to minimize the text and used the maximum number of images which can be self-explanatory.
The home page has a "Discover" button which can directly redirect users to the subcategories to know more about the university program. Moreover, the subcategories self explain their roles to the users with the images.
Hight-fidelity prototype
User engagement to the website is a very important thing. Unnecessary scrolling on the page disturbs the user to find out the particular details. So, we have listed the different categories on the page which can serve the respected content to the user once the user clicks on it.
In this way, the user doesn't have to scroll the whole page to find out the details.
The students who wanted to apply for the program faced difficulty while completing the university as well as department application with necessary documents. So, we suggested an approach in which the student can apply for the program with or without the documents in the first place. Then, he can upload documents later. By doing this the students will not have to worry about preparing the documents to apply for the program before the deadline. They can apply before the deadline and upload documents later.
If the student is able to upload all the documents and submit the application then a "Submit with documents" button will be used. The notification will be given to the student on success.
If the student wants to submit an application and upload documents later then he can select a "Submit and upload documents later" button. The next screen will notify the student to take next steps to complete the application.
After successful submission of the pending documents, the student will get the notification of completion of the application process.
Previous Project
