Duration: January 2023 to March 2023 (3 months)
Role: UX/UI Design
Team: CJ Ehrlich & Arthur Ibarra
Tools: Figma, Wix, and Keynote
User Research: Observations, Task Analysis
Agile UX Process: Research, Competitive Analysis, Wireframing, and Mid-Hi Fidelity Prototypes
The Heuristic Evaluation
Why does the Riverside Art Center's Website need to change?
1. Structural Elements: the type hierarchy issues and it feels like there is little to no information about the art center on the website. It feels like the layout is very disorganized, The homepage has too much going on and overwhelms the viewer and there are repeated buttons: The donate button repeats on the donation page.
2. Visual hierarchy: the website had poor type hierarchy and all the text is center alignment on the page
3. Color Palette: Every page had a different back color and there were too much colors that didn't make sense like: Black, green, lime green, olive green, gray, and pink.
4. Didn't seem to be an art gallery: for example, there isn’t a lot of artworks shown on the art gallery when we looked at it
5. Website Elements: The Navigation bar didn't have a drop-down menu for subtleties, circles throughout the page, the calendar didn't have any details for the events, and it also looked like some things were left out on the website like who is the staff members and how are the artists.
6. Calendar Element: The calendar looks unprofessional with personal meeting/events on it: After March, it’s looks under finished
7. Interaction Elements: Before the changes, the Riverside Art Center didn't have any drop down menus
8. Mobile version: hamburger menu that does work as a dropdown menu but CJ also noticed that the mobile version cuts off certain important details (probably due to sizing issues) such as the events calendar and another issue with the circles on the website that turn into ovals
9. The Design- The pages looked similar with every page and the person that makes the calendar for events puts their own calendar events on the same calendar!!
Problem
The problems with the River Art Center website was that it was very unorganized in terms of the layout and design. It was very difficult to use and understand how the website works. In general we realized that the website was overwhelming due to different fonts and the colors used throughout the website.
But the biggest problem that we noticed was the calendar they use. We noticed that whoever manages the website is putting there own personal info into the calendar and when you want to click on a certain event on the calendar the information provided is very limited and didn't have any way to RSVP to the event.
Personas
Before the changes
Original version on the Riverside Art Center website.
We saw the design of the calendar and imagine our Personas using this design to find an event which will be hard since they wasn't any information on the event and how it was hard to be determined what was the art center stuff and the person business events.
During the changes
Wireframe version of calendar created using Figma
We design this calendar prototype that has a color coordinated events to be determined what is an exabit to a Stain glass event at the Riverside art center. This design was used in our user testing, the results are shown on the bottom.
User Testing:
After the changes
Final version of calendar created on our WIX website.
We used the feedback from the user testing to made a final version of the calendar. CJ imaged that the personas (Amy and Mary) would have an easier time RSVP to an event that they are trying to book an event. Down below is showing how to book an event using the final prototype:
Step 1:
Step 2:
Step 3:
Step 4:
Step 5:
Concluded
We did the website prototype to show off the changes we did like more organized, limited color palate but our biggest final design was to bring a ore organized calendar where people can find events information quickly and where it's only the art center events. In our changes we put the events in more details like time, date, location, and how to get the tickets to the event. We changed things base on the user testing the two user testing that we did and one final user testing and the user stated that they like how the calendar was in on our prototype website.
A link to our Prototype website : https://arthuribarra99.wixsite.com/website
