Hot new topic being looked at today is Inspiredology’s latest web redesign. I made my .02$ on Twitter and was replied by ChadMueller curious for me to elaborate on the issues I had with the new redesign, mainly the surrounding UI.
thejellymon: Inspiredology Lab header and BG is awesome, but I don’t like the remaining UI style…Lackluster compared to the header http://bit.ly/bjHpdI
9:42am, Jul 26 from HootSuite
chadMueller: @thejellymon we are really happy with the illustration - if you want to elaborate on the UI - I would love to get more feedback
I wanted to take a chance and give a bit more of an indepth response for Chad so I formulated this post because 140 Twitter characters would not give Chad enough feedback for his new redesign.
Site Intro and Header
First and foremost, I LOVE the header/illustration. It really brings you into the website by slewing together great characters, art style, story, and static animation. This is engaging & beautiful & really sets the tone of the remaining site.
Unfortunately the remaining UI of the site falls short in terms similar execution and style. The formulation of color withers away by a sea of muddy grays and off blues.
What happened to the color and style we found in the header? As we scroll down the feeling is broken and discontinuous - the inspiration in the illustration seems to dissipate. I do not think that the dark idea behind this theme is bad, no, just needs more elaboration. I am a bit advocate of dark and minimalist websites - these dark qualities frame and showcase the illustration very well.
Where do we get re-attached?
Once we’ve hit rock bottom. When we find ourselves at the bottom of the page we are reunited with the page’s ideology - and the reason why we stayed on the page in the first place! Check out the use of graphics, different typography colors and types!
Cohesion. The connection is made again! These graphics tie in with the illustration at the top, the varying typography create well needed contrast from the overall gray & seemingly similar typographic usage in the postings. The color from the added illustrations is also very refreshing.
How should this be resolved?
Well, the site is made; and it isn’t bad mind you, it just needs more work - it’s almost finished. So without restructuring the site and throwing away all the hard work we have done; what do we add or take away to enhance the User Experience? Most are minor CSS changes:
- Add more variances of color and typography to create more contrast on the page and within posts. This will alleviate the gray “muddy-ness” of the page. Experiment with adding simple Rules underneath some sub-headlines to break up the flow of text and imagery.
- Instead of the gray bar that shows post information (date, author, comments, etc) why not add a illustrated “bookmark” or book tab like the ones found in the illustration? Or push the idea of the chalk board to create something for this area.
- While scrolling, add some cool graphics/illustrations (chemical bubbles or another lab rat) on the sides of the blog boarders to keep us attached to the idea of the site as well as the its style - this will also make it more fun!
I like the site overall. Unfortunately, the overall feel and execution of the site disservices the creator and the header. I think adding in these few changes and expanding the topics I briefly hit on will expand the feel of the website and push it to be its own brand. The changes will enhance user experience by being more organized and cohesive.