4 ms·

37Signals' product websites redesigned

36 points by csbartus 18y ago

dmix 18y ago
The footer, that was there before the redesign, has always been my favourite part. The big colourful icons standout.
dshah 18y ago
I'm hoping Jason and crew write a blog article describing what they changed (and why). Would make for some great reading.
- jfornear 18y ago
  They have a few posts related to this (also posted to HN, if I recall): http://www.37signals.com/svn/posts/1582-design-in-progress-choosing-the-right-product http://www.37signals.com/svn/posts/1582-design-in-progress-c... http://www.37signals.com/svn/posts/1622-design-in-progress-product-bubbles http://www.37signals.com/svn/posts/1622-design-in-progress-p... http://www.37signals.com/svn/images/37s-preview-b3faa2088b4e609877c70605f65efa2d.jpg http://www.37signals.com/svn/images/37s-preview-b3faa2088b4e... I'm surprised this made it to the top of HN, though. This is all really old news to me, and I wouldn't consider myself a 37signals fanboy.
idont 18y ago
So many font types, font sizes, font weights, colors... Too messy for me... Maybe I am too Swiss... ;)
- puns 18y ago
  I think it's great. There are many fonts and colors and variation, but the design still has clear sections (short product descriptions, detailed about company blurb, client videos, buzz etc.), and more important, there are points in the design that grab your attention and suck you in; these are the big icons at the top with large speech bubbles and the "A Better Way To Work" heading. This means as you glance over the page your eyes will find a place to land, and I think the copy itself is very well done -- short and to the point -- which means I'm likely to actually read it. One thing that always bothered me is the navigation 37signals tend to use. It's stuck at the very top of the page and is set in a very small font size. Current locations are also not highlighted on some pages. Perhaps they don't rely on it at all and instead focus on getting people to click on calls to action inside the content.
  - gry 18y ago
    It is a big improvement over what they had; I think they present what they do now more than ever: the black box says we help work -> via four products. I expect a website to do one, maybe two things well. I'm a hard sell on three. The middle doesn't do much for me. It's a content stack and I have to _study_ it to glean meaning. Buzz, about, client vids, etc. My gut says this is filler. Now given the last few days with Google's data/design approach, I'd love to see a heatmap and numbers. :)
- Zev 18y ago
  Its not the font types/sizes/weights/colors that bothers me about the site. That all works - very well. Its how much damn text they have on there. Too much information being displayed with too much scrolling. Moving the left column over to its own page would make me like the site much more. I really hope this isn't the next trend in website styles.
  - rs 18y ago
    Same experience here. I do wonder to what happened to "less is more"
- GBKS 18y ago
  I agree with you. Initially my eyes get pulled to so many things at once, I have a hard time focusing on a single piece of information on the page. Looking at the page a bit longer, it becomes easier to absorb. One of the reasons for that is that the top elements in the visual hierarchy are the bubble background shapes (and not the text in the bubbles). So at a first glance, my eyes just pick up four big bubble shapes. I think the site would work very differently if the bubble backgrounds were very light and the text in them wasn't as tightly set. For me personally, this semi-clutter speaks against their products and the company's focus on simplicity. I'd have preferred a more minimal approach that allows each element to breathe a little more.
bdotdub 18y ago
How is this news?
- jrockway 18y ago
  Well, they made a website with ruby on rails and without venture capital. Totally awesome!
fuzzmeister 18y ago
I think the main black box draws the eye a little too effectively. I have trouble focusing on other parts of the page.
- bmelton 18y ago
  Wow are you ever right. I just came back to HN to post a similar remark -- it's damn near impossible to read anything outside that box. Or perhaps we're both deficient in some unique way that makes us susceptible to black (or near black) boxes.
  - ptn 18y ago
    Make that three of us. Even when I'm looking at Campfire, I'm still reading the black box through the corner of my eye. Also, I think it looks like the second half and the first half were designed by totally different guys. The first is really colorful, which helps tell the sections apart, but the second is nothing like that, just their plain old vanilla. And at the end...wham! The black box of death again.
rms 18y ago
I have my fonts sized larger than default and forced to Verdana so they stick out of some of the boxes.
- BSeward 18y ago
  I'm seeing it on Eee Linux, which lacks a number of 'web-safe' fonts, and if it did have them it would have no idea how to properly display them. I think we rightly fall in edge cases not worth supporting, alongside IE6 ( http://ipinfo.info/netrenderer/index.php?browser=ie6&url=37signals.com http://ipinfo.info/netrenderer/index.php?browser=ie6&url... and http://37signals.blogs.com/products/2008/07/basecamp-phasin.html http://37signals.blogs.com/products/2008/07/basecamp-phasin.... ). It wouldn't be a ton of trouble to make the text bubbles expand to fit the text (one more div and splitting the background images, I suspect but won't confirm). But their goal was, I assume, to have a well-aligned, eye-catching 2x2 grid, and they chose not to support rare-ish cases where that wouldn't be what was rendered rather than cluttering their markup.
briansmith 18y ago
Their design inspiration: http://www.parrotsecrets.com/ http://www.parrotsecrets.com/
antidaily 18y ago
funky alignment in the "also from..." section. ah, that's better: http://i43.tinypic.com/mwqoeg.png http://i43.tinypic.com/mwqoeg.png
sscheper 18y ago
I think this is one of the cases where the guys are so into technology/design, they're constantly changing it because they have nothing better to do.
petercooper 18y ago
I was really encouraged by the HighriseHQ design of several weeks ago, along with the blog posts about the redesign but... now the real deal is here, it's clutterville :( Very difficult to scan. Perhaps it'll look better when I get back on my desktop but on this 1024 pixel width netbook it's just a smush of poorly separated text. Anyway, it's not that important, I guess. They have good products and a supportive userbase. They don't need a slick site to sell what they have.. and if you look at the sites of most Fortune 500 companies, they're usually poorly designed so perhaps they're aiming for that club.
systems 18y ago
I think this is a bad design, I don't like it. But then I never liked their products either! Different people like different things, this is why I guess we have different firms offering variations of the same products. They say they have 3,000,000 customers so I guess at least the 3% (random percentage of decision makers) who forced the other 97% (the team) likes it!
KWD 18y ago
Too busy and too much information is my initial thought. I'd also probably have the two-column video section switched to the right instead of left. Also to me, the vids are the fluff of the page, and makes the product information I want to read harder to find.
halo 18y ago
The bottom 2 product names are cut-off on a maximised browser window in Firefox at 1280x800 (i.e. a 13" laptop), which is quite a big problem.

36 points by csbartus 18y ago

dmix 18y ago

The footer, that was there before the redesign, has always been my favourite part. The big colourful icons standout.

dshah 18y ago

I'm hoping Jason and crew write a blog article describing what they changed (and why). Would make for some great reading.

jfornear 18y ago
They have a few posts related to this (also posted to HN, if I recall): http://www.37signals.com/svn/posts/1582-design-in-progress-choosing-the-right-product http://www.37signals.com/svn/posts/1582-design-in-progress-c... http://www.37signals.com/svn/posts/1622-design-in-progress-product-bubbles http://www.37signals.com/svn/posts/1622-design-in-progress-p... http://www.37signals.com/svn/images/37s-preview-b3faa2088b4e609877c70605f65efa2d.jpg http://www.37signals.com/svn/images/37s-preview-b3faa2088b4e... I'm surprised this made it to the top of HN, though. This is all really old news to me, and I wouldn't consider myself a 37signals fanboy.

idont 18y ago

So many font types, font sizes, font weights, colors... Too messy for me... Maybe I am too Swiss... ;)

puns 18y ago
I think it's great. There are many fonts and colors and variation, but the design still has clear sections (short product descriptions, detailed about company blurb, client videos, buzz etc.), and more important, there are points in the design that grab your attention and suck you in; these are the big icons at the top with large speech bubbles and the "A Better Way To Work" heading. This means as you glance over the page your eyes will find a place to land, and I think the copy itself is very well done -- short and to the point -- which means I'm likely to actually read it. One thing that always bothered me is the navigation 37signals tend to use. It's stuck at the very top of the page and is set in a very small font size. Current locations are also not highlighted on some pages. Perhaps they don't rely on it at all and instead focus on getting people to click on calls to action inside the content.
- gry 18y ago
  It is a big improvement over what they had; I think they present what they do now more than ever: the black box says we help work -> via four products. I expect a website to do one, maybe two things well. I'm a hard sell on three. The middle doesn't do much for me. It's a content stack and I have to _study_ it to glean meaning. Buzz, about, client vids, etc. My gut says this is filler. Now given the last few days with Google's data/design approach, I'd love to see a heatmap and numbers. :)
Zev 18y ago
Its not the font types/sizes/weights/colors that bothers me about the site. That all works - very well. Its how much damn text they have on there. Too much information being displayed with too much scrolling. Moving the left column over to its own page would make me like the site much more. I really hope this isn't the next trend in website styles.
- rs 18y ago
  Same experience here. I do wonder to what happened to "less is more"
GBKS 18y ago
I agree with you. Initially my eyes get pulled to so many things at once, I have a hard time focusing on a single piece of information on the page. Looking at the page a bit longer, it becomes easier to absorb. One of the reasons for that is that the top elements in the visual hierarchy are the bubble background shapes (and not the text in the bubbles). So at a first glance, my eyes just pick up four big bubble shapes. I think the site would work very differently if the bubble backgrounds were very light and the text in them wasn't as tightly set. For me personally, this semi-clutter speaks against their products and the company's focus on simplicity. I'd have preferred a more minimal approach that allows each element to breathe a little more.

bdotdub 18y ago

How is this news?

jrockway 18y ago
Well, they made a website with ruby on rails and without venture capital. Totally awesome!

fuzzmeister 18y ago

I think the main black box draws the eye a little too effectively. I have trouble focusing on other parts of the page.

bmelton 18y ago
Wow are you ever right. I just came back to HN to post a similar remark -- it's damn near impossible to read anything outside that box. Or perhaps we're both deficient in some unique way that makes us susceptible to black (or near black) boxes.
- ptn 18y ago
  Make that three of us. Even when I'm looking at Campfire, I'm still reading the black box through the corner of my eye. Also, I think it looks like the second half and the first half were designed by totally different guys. The first is really colorful, which helps tell the sections apart, but the second is nothing like that, just their plain old vanilla. And at the end...wham! The black box of death again.

rms 18y ago

I have my fonts sized larger than default and forced to Verdana so they stick out of some of the boxes.

BSeward 18y ago
I'm seeing it on Eee Linux, which lacks a number of 'web-safe' fonts, and if it did have them it would have no idea how to properly display them. I think we rightly fall in edge cases not worth supporting, alongside IE6 ( http://ipinfo.info/netrenderer/index.php?browser=ie6&url=37signals.com http://ipinfo.info/netrenderer/index.php?browser=ie6&url... and http://37signals.blogs.com/products/2008/07/basecamp-phasin.html http://37signals.blogs.com/products/2008/07/basecamp-phasin.... ). It wouldn't be a ton of trouble to make the text bubbles expand to fit the text (one more div and splitting the background images, I suspect but won't confirm). But their goal was, I assume, to have a well-aligned, eye-catching 2x2 grid, and they chose not to support rare-ish cases where that wouldn't be what was rendered rather than cluttering their markup.

briansmith 18y ago

Their design inspiration: http://www.parrotsecrets.com/ http://www.parrotsecrets.com/

antidaily 18y ago

funky alignment in the "also from..." section. ah, that's better: http://i43.tinypic.com/mwqoeg.png http://i43.tinypic.com/mwqoeg.png

sscheper 18y ago

I think this is one of the cases where the guys are so into technology/design, they're constantly changing it because they have nothing better to do.

petercooper 18y ago

I was really encouraged by the HighriseHQ design of several weeks ago, along with the blog posts about the redesign but... now the real deal is here, it's clutterville :( Very difficult to scan. Perhaps it'll look better when I get back on my desktop but on this 1024 pixel width netbook it's just a smush of poorly separated text. Anyway, it's not that important, I guess. They have good products and a supportive userbase. They don't need a slick site to sell what they have.. and if you look at the sites of most Fortune 500 companies, they're usually poorly designed so perhaps they're aiming for that club.

systems 18y ago

I think this is a bad design, I don't like it. But then I never liked their products either! Different people like different things, this is why I guess we have different firms offering variations of the same products. They say they have 3,000,000 customers so I guess at least the 3% (random percentage of decision makers) who forced the other 97% (the team) likes it!

KWD 18y ago

Too busy and too much information is my initial thought. I'd also probably have the two-column video section switched to the right instead of left. Also to me, the vids are the fluff of the page, and makes the product information I want to read harder to find.

halo 18y ago

The bottom 2 product names are cut-off on a maximised browser window in Firefox at 1280x800 (i.e. a 13" laptop), which is quite a big problem.