Introducing our new web site !!!

After years of mumbling excuses about the cobbler’s children and how busy we’ve been, we’re thrilled to announce the launch of our new site. It’s taken almost a year from our initial design explorations, but we’re really happy with where we’ve ended up.

While its been a very collaborative effort, it’s also been refreshing to design without the usual cast of stakeholders. (In order to overcome the well-known nightmare that is a firm designing its own site, we almost completely eliminated creative reviews by anyone not directly involved in the project.)

We think the new site much better reflects our design sensibilities and the direction of the firm. It’s still a bit of a work-in-progress. (For one, we plan on adding social bookmarking features in the Journal when we have a moment.) But we’re interested to hear your feedback—let us know what you think in the comments section.

Credits

Design by Nick Myers and Dave Cronin, with help from Jayson McCaulliff, Doug LeMoine, Imon Deshmukh, Martina Maleike, and Daniel Kuo. Copy by Dave and Doug, with editorial assistance from Steve Calde and Suzy Thompson. Code by the amazing Elisha Cook and Andrew Hoag at blackdrumm, and photography by the very talented Emily Nathan.

25 Comments

Jon Whipple
I really like the way the site is organized and how easy it is to slide across sections and drill down into detail. The visual hierarchy of the pages is attractive and nice. It feels really nice to use, and always seems clear and inviting no mater where I go, scroll, or click. I like the details like the navigation items highlighting as a scroll to them, and I also like the finish applied to the animations in terms of speed and easing effects. I am trying to work out how you guys are handling the concept "pages" and how it relates to other considerations like SEO and analytics. If you can take the time, I was wondering if you guys could elaborate how you're handling these factors?
Dave Cronin
Hi Jon. Thanks for the kind words. We know we took a bit of risk, and broke several rules in the process. We're happy to hear that it resonates with you. As far as SEO goes, there are actually individual html pages on the server for each of the items accessible from the navigation. If you look at the code, you'll see that the navigation actually links to those (for SEO purposes) and we use javascript to navigate within the "big page." In fact, for older browsers and mobile browsers (like all the poor folks who are stuck on IE6 at work), we serve those pages. Also, because of a strange bug on some installs of Firefox, and inconsistently reproducible issues with IE8, we're about to activate a feature that allows anyone to use the SEO/vanilla version of the site.
jj
WTF is this? How am I now supposed to refer people to Cooper when I'm trying to defend ease of use through good interaction design? This thing is confusing. I don't come to your site to engage into your cool navigation skills.
Geof Harries
Beautifully done. While some of the interactions aren't as well-conceived as I'd expect from Cooper - for example, the horizontal movement back to far left results in a big open space; is there no way to restrict that? - it's very creative, yet natural and intuitive. Inspirational stuff. Thanks for taking the risk and showing what's possible with a modern business website.
Dave Cronin
Hi Geof, Thanks for the kind words. The issues with the interactions are probably more about the implementation than the conception (though I'll let you be the judge of that). It's tough to do this some of this stuff in cross-browser html/css/js. The whitespace to the left and right is to allow enough space for the content to center on wide browsers. We had a fix that didn't allow users to scroll into the white space, but there are some issues with Firefox 3.6 that resulted in a terrible experience for some users. (It's totally inconsistent-- happens on some installs, not on others. It didn't show up at all in our QA.) Our new idea is to do something fun in that white space. Stay tuned...
Alan
It's a very interesting design. The photography is fantastic. Did you test the website with assistive technologies, such as as screen readers or screen magnifiers?
Jonathan
The trouble with designs like this is that while you're getting used to the new, it's hard to know whether what you're getting used to is great, awful, merely OK, or just silly. In trying to decide which, I would recommend switching to the "standard" version the designers have provided (see the tab labelled "Technical problems?" at the bottom) and compare and contrast. Which is the better experience? In which can you feel your mind being asked to do more to get the same result?
Geof Harries
Dave, yep, definitely been there ourselves. When you're pushing the limits of any technology, web browsers included, stuff is gonna break...including rules and perceived standards. Good on ya for taking a chance and making the Cooper website experience fun and memorable.
Nathaniel Flick
First off I'll say I know how hard it is doing your own website, so well done on changing it! However... 1. The website, the one page, is now 3.5MB! Not good for those of us outside the US with less than perfect internet connections, and horrible for Google SEO. 2. Again, why not just use separate pages for all the content? 3. Not keen on the hidden page controls. Even when I figured out what they were for I kept accidentally clicking on them. Keep it simple, Cooper! That's what you're best at. Otherwise, nice layouts and content. Keep on improving, there's more to do (As there always is). :) Nathaniel Flick Dirt and Rust, Ltd.
Anders Nyhuus
I'm not trying to offend you, but it looks like the inmates really are running the asylum at Cooper's! This is a dancing bear. I'm left with the feeling that the website is designed this way simply because technology enabled you to - not because it is particularly user friendly. I agree with jj above wrt referring to Cooper's website as an example of good interaction design. I liked the previous version a LOT better. I find the new design confusing and difficult to get a good overview of. First negative reaction was on the horizontal scrolling. After a while when I got that, I started to look for a zoom-function so I can see the whole picture. This new design is not intuitive at all for me (maybe I'm an old traditionalist who can't handle changes easily, but still). Steve Krug's book about web design springs to mind: "Don't make me think" (http://en.wikipedia.org/wiki/Don%27t_Make_Me_Think). I have to think a lot to figure out Coopers new website design. Again: I apologize if I'm offending anybody by speaking my mind - that is not my intention. English is not my first language.
Bill Slawski
Wow.
As far as SEO goes, there are actually individual html pages on the server for each of the items accessible from the navigation. If you look at the code, you'll see that the navigation actually links to those (for SEO purposes) and we use javascript to navigate within the "big page."
Unfortunately, I think someone may have given you some bad advice.
Nick Myers
Hi Bill, You can find many of the new pages are already indexed and working effectively on google.com. For example, do a search for "visual interface design training" and Cooper comes up as the third result. I wouldn't call that bad advice.
Nick Myers
Here's a snapshot of the website in full that was taken by Amber Case. The homepage didn't quite make it on there but it still gives you a sense of the entire page.
Nick Myers
Alan, We did our best to create standards-based markup and also provide a vanilla version of the site without the bells and whistles. We have not tested directly with assistive technologies due to our limited time and resources but believe they both should work fairly well.
Bill Slawski
Hi Nick, I'm seeing a number of issues from an SEO stance that could potentially be a problem. The site does rank well for an extremely non-competitive term like "visual interface design training." It's likely that the site may rank well for even more competitive terms, based upon a wealth of links pointing to its pages, but what's happening on the pages of the site seems to be the opposite of optimization. My intent in commenting was intended to be helpful; please don't shoot the messenger. It might serve you well to get some second opinions from someone you trust.
ac
I tried to view the vanilla site in Firefox and got this error...... Content Encoding Error The page you are trying to view cannot be shown because it uses an invalid or unsupported form of compression. * Please contact the website owners to inform them of this problem.
Paul Davis
What was the thinking behind the Floating the Cooper logo. A smalller logo on the nav bar would be smarter solution.
Nick Myers
Hi Bill, We took several considered risks with the new design. I hope that you don't feel like I'm being defensive or trying to shoot you. In fact, we'd welcome any advice you have to offer related to our approach. You can send email to nick at cooper or webteam at cooper.
Nick Myers
Hi Paul, we plan to share some of our thoughts behind the new design over the coming weeks and will try to touch on the logo position and treatment. Thanks for your suggestion. It was a consideration that we ultimately decided against even though I recognize that we're going against some brand principles with our current design.
Chuck Martin
I have long hated horizontal menus, and trying to navigate the cooper menus (to get to the Careers page) just confirms my hatred. And I don't understand why they are desired, for two primary reasons: 1. When a user is looking to navigate, they don't (likely) care about any content on the page. I can see the conversation now: Hotshot web designer: "Look, we can code this so the menus don't hide any of the cool graphics or the content that is so important." Customer: "Sounds good. Do it." 2. Moving a cursor across a narrow band without leaving it turns out to be quite a challenging task. It's why menu's drop "down" for horizontal text, so it's easy for users to scan with their mouse and find the target. It's sort of why the Mac design of "pinning" the menu bar to the top of the screen is seen by interaction designers as a useful choice, so users can just "slam" the mouse up against the top and always hit the target. Other than that, the first impression is a triumph of style over substance. My response to those who are always pushing to "style up" their website is that there's a reason why craigslist, after all these years simply nothing more than a huge page of well-organized links, is perennially one of the most popular and heavily used sites on the whole of the Internet. I have the notion that a redesign was done because someone thought it was time to do a redesign, not because it necessarily provided a better experience--or solved any issues with the previous experience (which I personally liked). More than anything, I hope it wasn't done for "rebranding" purposes, because--especially in lean times--I see rebranding as one of the most vacuous wastes of money and time a company can possibly undertake.
Chuck Martin
Nick, you replied to one comment that you've worked hard to make the site standards-based. Yet in scanning the page code, I see at least one chink of embedded JavaScript and a severe case of what Jeff Zeldman call "div-itis." Many, many chunks of content aren't in semantically descriptive tags; many are in nothing more than sets of div tags. Thus there is little actual structure to the document. This create-one-big-page-and-more-it-around approach, like what's done with CSS image swapping, definitely creates some confusion, especially because it forces a horizontal scroll bar. Plus, instead of seeing a new page appear when clicking on a link, users can feel disoriented by seeing images seemingly swirl around. I'm definitely motivated to go to cooper.com on my iPhone and my iPad and see what the experience is like. I also wish I could have been a fly on the wall when this type of experience was being discussed. I'm tremendously curious to know especially what was thought to be good about this experience, and how it was considered better than the previous one.
Thomas Benoit
Hi, Congratulation for the launch of your new website. I give you my feeling about it (since like I most of your readers I work in the field of web design so I can not help to do so). I find the concept interesting and I like the fact that it is innovative (however I am not sure about the google hack mentionned above... do you have a reference for this technic? ) What bother me the most is the design/realization. When watching the site on a wide screen, all the pages are side by side but they don't look the same (typography, grid, color) so it becomes difficult to read and confusing. Otherwise, I appreciate that you try to innovate. I already considered your company as one of the top in its field and this new design reinforce my idea.
Kishor
Congratulations! Very nice approach.
Brian
I ran across your site via Google search for "personas". I entered the Journal and was really impressed with the content - thanks! Navigating to your homepage threw me for a loop after everything I had read. Once oriented, I tried to click/drag/throw and zoom a la Google Maps. Certainly, I thought, that's the paradigm for this large page format. It probably didn't help that I also ran into the issues you comment on above -- Firefox 3.6 on Win7 (expansive white space left and bottom; continual vertical scrolling with only a small portion of the website showing at far right). I will certainly recommend your site for the content but I would caveat with "please disregard/ignore their interaction design approach". The photos and layouts are very nicely done in my opinion. I appreciate you asking for the feedback. I think you guys do great work.
Valentin filippov
Hi guys, I'd like to say a big thank you for taking all the risks with such an unusual design. 'Thank you' because now the site gives something more than just info + brand -- it gives inspiration on interaction. It lets the visitors taste the joy of interaction designed with imagination and love. I beleive this could be the company's mission, couldn't it? :) All the best!

Post a comment

We’re trying to advance the conversation, and we trust that you will, too. We’d rather not moderate, but we will remove any comments that are blatantly inflammatory or inappropriate. Let it fly, but keep it clean. Thanks.

Post this comment