UX DESIGN
My New Media Design course was a class devoted to the development of front end design for websites and apps. We focused aesthetic using fonts, imagery, spacing, and graphics to create pleasant, effective looking designs.
My peers and I were tasked with redesigning any terrible looking website we could find online. I collaborated with 2 others to redesigned the website for Bigger Vision Community Shelter located in Athens, Georgia.
Their website was messy, unattractive, and confusing:
Reimagining the website of
Bigger Vision Community Shelter
Their original page was created with the following problems:
-
Designed without a grid so the layout appears unorganized and chaotic.
-
Overlapping features made the site hard to navigate.
-
Lack of negative spaces make the website crowded.
-
Used too many shapes and designs.
-
Randomly placed buttons.
-
Poorly formatted fonts.
-
Bright colors clash with the earth tones.
-
Greasy, brown paper bag background is unpleasant.
-
Multiple type faces, font weights, and font sizes.
-
No hierarchy of font.
As far as user experience is concerned, the website had no logical flow. The redundant links, lack of organization, and lack of balance made the website appear unprofessional.
When redesigning the website, we strived to always keep the user in mind and put ourselves in a potential user's position through each step. We wanted the site to be as easy to use as possible and to get the point across quickly and effectively.
How we improved the site:
-
Used a grid to create balance and symmetry.
-
Utilized a plain white background for simplicity and cleanliness.
-
Added negative space to give the eye somewhere to rest.
-
Chose calm, cool colors that coordinated with their logo.
-
Decided on one font and created a hierarchy with colors, typeface weight, and font sizes.
-
Cleaned up the page to make it appealing and readable.
Keeping the user's experience in mind, we added a new, easy-to-read navigation bar, high quality photos, and buttons with clear purposes. Contact info and location are easy to find, the format and color scheme is aesthetically pleasing, and the flow is easy to understand.
My group emailed our redesigned website to Bigger Vision Community Shelter and they ended up using parts of our design to redesign their website.
This is what it currently looks like: