Interactive Design- Refurbished Website

The website I chose to remake is a radio station site, that plays entirely music from the late 60s through the 70’s and 80’s. Their main target audience is mostly males in their 40’s and 50’s.

Some good things this site is doing are things like the color choice and the use of a gradient. However the checkerboard pattern jumbles up the outside border of the page and distracts the viewer, while at the same time being very bad to look at. Also to note is at the top there is a solid color right before the gradient. That is even more distracting, as it just cuts a portion of the page from the gradient pattern instead of just using the pattern all throughout the page.

The use of the listen live button is interesting, but readability is odd, especially with the gradient background, it would be better suited to being a solid color.

The featured video of the week is an interesting idea, it gives viewers something new to look at and to come back to the site regularly. However, the so called “Featured” video is at the very bottom of the page. It’s not so much featured as it is an afterthought. It would be better suited at the top in the slideshow.

From research, three websites that are doing the cool style better to it’s middle aged male audience are websites like Jimmy Buffett’s Margaritaville, Harley-Davidson, and Guitar Center. Margaritaville has it’s style down, while at the same time using it’s cool relaxing colors. Harley-Davidson gives off the cool vive by keeping a simple, streamlined style of site, using video at the beginning of the page to get the viewers attention, and describing what the company is about in a simple phrase on top of that video. Guitar Center is selling cool. They are showcasing what they are about and their product right in front of you, giving you all the details and all of the technical terms, as well as having a clean and easy to read design.

XD Draft: https://xd.adobe.com/view/9e3f0693-4fb6-4b19-8ad6-36118160ccc9

Revised XD Draft: https://xd.adobe.com/view/c20fb41c-75fe-41ff-987e-85b5b6a3f727

This draft addresses the problems of depth change, text hierarchy, positioning issues, as well as adding somethings. The white boxes to the right of the page are only there to show where a person has scrolled to along the page, as Adobe XD doesn’t have a fixed image option yet.

Final Site: https://jamesstephens.000webhostapp.com/Site%20Revision/assign5.html

This portion addresses the emptiness that happened between sections of the page. That space is now filled with scrolling images.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s