PSDFan Extra

30 Minute Redesign: Yopler

Week 72: Yopler

This week I will be redesigning: Yopler.

In the space of 5 minutes I can identify some of the key strengths and weaknesses of this design, and sketch out a mockup.

STRENGTHS:

  • The overall design is clean and professional. I’ve worked with a lot worse looking site’s during this series!
  • It’s fairly obvious what the site does, through the imagery of music videos, music search form, slogan attached to the logo and page title.
  • The site uses cohesive typography and colors, making it feel very together.
  • There is a good amount of white space on the page, with all the elements being padded well to avoid crowding.

WEAKNESSES:

  • The site seems like quite a social concept, but doesn’t feel particularly social. I would give more emphasis to the idea of playlists and sharing music.
  • The search form, whilst fairly large isn’t prominently positioned. I would position it beneath the header and really make it obvious to encourage users to search for music.
  • Whilst the format of laying out songs according to album art in a grid format looks quite cool, it doesn’t seem that functional, and particularly the requirement to hover in order to play or share is bad usability.
  • There is nothing that tells us how ‘current’ the site is. For all we know this could be a concept that was popular years ago and is now hardly used. Again, I would stress the social/up to date nature of the site to encourage user action.

My Redesign

As always, I was limited by the 30 minute time-frame, but I tried to improve upon several of Yopler’s features, adding a few design flourishes and a clearer layout that promoted content over wasted space:

MY AIMS FOR THE REDESIGN:

  • I made the search form much more prominent, positioning it under the header to encourage users to search for music.
  • I removed the album artwork and displayed tracks in a more natural list format. This was better for managing space on the homepage also.
  • I made the site feel much more social and up to date, adding areas such as ‘playlists of the week’ and showing the most popular tracks played each day/week/month.
  • I made the site even cleaner and introduced a simple tabbed navigation to help with usability.

Before/After:

Here is a quick comparison between the original design and my 30 minute redesign. Sure, my design could be more polished, but I believe that a lot of the basic elements have been improved upon, creating a more pleasant browsing experience.

How and Why To Enter 30 Minute Redesigns

You can have the chance to have your website redesigned in next weeks post. All you need to do is leave a comment to this post with your website address and why you think it needs a redesign.

The Benefits of Getting Your Site Redesigned Include:

  • Most obviously – a FREE redesign job!
  • Your website gets exposure to PSDFAN’s thousands of readers
  • You understand how to improve your website. This isn’t just a redesign, it’s a lesson in design principles.
  • You will get emailed the .psd of your redesign and can do whatever you want with it!

NOTE: I can only accept sites with English content, as foreign language websites are simply too hard for me to work with.

So please, leave a comment today for a chance to have your website redesigned next week!


About the Author:

Tom is the founder of PSDFAN. He loves writing tutorials, learning more about design and interacting with the community. On a more interesting note he can also play guitar hero drunk with his teeth.

Leave a comment

9 Comments:

  1. steph says:

    A really good redesign and new structure for this website. I think that the main structure is the main thing on this redesign that has really made a difference to it as you need to be able to navigate your way through the site as easily as possible or you will loose interest and try another site. This clean and structured new look works really well. The only thing I would say is visually it is lacking some what so maybe each track does have a screen shot like it does in the redesign to break it up a bit

    • Tom says:

      Thanks for the feedback Steph! Ideally I would have added some more visual details to the design, but within 30 minutes I mainly wanted to focus on the structural elements you mentioned. I’m glad you liked my redesign though.

  2. Guro Weich says:

    Hello,

    I would love to have your help redesign a website I am working on. The website is http://www.ocdeaf.org

    Many thanks!

  3. Hi! Thanks very much for your take on Yopler, we share many of your thoughts, this is our recent, non-commercial project made for fun, so we don’t have much time for it, but we constantly think about big redesign.

    Yes, we want to make site more social. Especially add playlist sharing functionality.

    No, we dont wan’t to get rid of all the graphics. For now we use album covers from last.fm and thumbnails from Youtube – quality and relevance is big problem though.

    Your feedback is very valuable, but we wan’t to go more in direction given by WeAreHunted.com , which was our greatest inspiration (in both versions – old & new) . But, your redesign gives me few ideas how make our site more usable.

    Thanks very much & best regards!

    Gniewomir ?wiechowski
    Mashup Media Sp. z o.o.

    • Tom says:

      I’m glad you liked my redesign :) . I know that personal sites are often a struggle in terms of finding the time, but I’m glad to hear you’re moving in more of a social direction with it.

      Wearehunted is a cool looking site btw!

      • It must be social. Especially because we planned making not only easy to use music player for YouTube (SoundCloud?), but also music recommendation engine, with recommendations based on music from Facebook friends of our user.

        We think, that algorithmic recommendation from services like Last.fm can effectively lock us in one genre, so we look for a way around. :)

  4. Tom:

    I’ve always followed these 30-minute redesigns intently, they’re a great idea.

    I would like to submit our site for a redesign. The current design is not all that old, probably only about 12 months, but I feel it’s lacking a certain presence, and a strong call to action. If it gets chosen I would be very interested to see what you come up with.

    Cheers

    • Tom says:

      Good timing Jon! Your site just made it into today’s running (it was a one horse race before). I’m just going to go and put together the poll post now.

Leave a Comment:

Cancel reply

Related Posts

Your Design Work, But More Awesome:

Do you know the basic tools in Photoshop but feel that your work is still looking average? Join our creative community at FanExtra and get the direction you need to take your work to the next level.

JOIN OUR FANEXTRA COMMUNITY TODAY