English360.com
~ 19 July 2005 ~
On the heels of the unconventional, even somewhat “controversial” Vivabit design comes another site launch quite neutral in comparison: English360.com.
Billed as a radical new approach to English language learning, English360 aims to combine technology and connectivity to fill a void in the current global learning economy. (Note: The “radical new approach” is coming at a later date and therefore isn’t featured on the site just yet.)
However, radical approaches need not always require radical design. This design attests to that, relying instead on minimal aesthetics to portray its message.
Prior to site development, I also had the pleasure of creating the identity. The approach was also minimal, and the mark suggests the progression of small, previously unconnected groups attaching themselves larger, connected groups.
I seem to be abusing Avenir of late, but after exhausting several other type options — News Gothic, Nimbus Sans, Trade Gothic, Dax, etc. — Avenir still came out on top.
Hats off to the Cleve Miller (client) and Carson McComas (project manager) for their roles
in the two projects. And lest I forget, try the mobile version (currently only one page)
on your mobile device, replete with XHTML Mobile Profile and featured at WebVisions 2005.
25 Comments
Veer: Visual Elements for Creatives.Stock photography, type, and killer tees. Genuinely recommended by Authentic Boredom.
Beautifully done, Cameron - both site and logo. The site is clean, easy to navigate, and I’m never at a loss of where I’m at or wanting to get to another page.
I’m curious about one thing. The integration of MT into the “recent discussions/blog”. Is there a particular reason to got with MT vs. WordPress or TextPattern? Out of the three, I’ve never used MT. So I ask, in part, out of ignorance.
Hercules - I’ll have to give that a look. Thanks for the note.
Thomas - MT was chosen by the client, actually, though I would have pushed for the same simply for time’s sake (I know MT well, but not the others). The biggest push with this client is yet to come, some interface work that is/will consume more time than these two projects combined.
Interesting design, and color choices… I was actually looking at using a very similar color scheme for something I have on the back-burner right now.
One thing of note that I noticed though. On the front page, if you are looking at the #catnav, it looks great, but if you hover just barely off of the p a, you jump back up the hierarchy to the a.on. It appears that the p is not as wide as the hyperlink. It becomes distracting and a little unnerving as well because they’re not all the same size. Learners is by far the most apparent, with Schools being the closest to my expected behavior.
Oh wow, that is a truely beautiful piece of minimalism. It’s amazing how you can quickly adapt to different styles as this is a radically different design to the vivabit site.
Steven - I think I follow. You mean the two hovers on the text and the bg button itself? If so, I hear you — that probably needs to be readdressed, as the two links can offset each other somewhat unexpectedly. I originally thought I’d make the :link and :hover states the same color for each to render it less noticeable, but that meant too much orange.
I’ll keep this mind for attention as time allows.
You basically have the right idea. Just to illustrate more clearly what I was talking about though, here’s a screenshot: 
The red border represents the clickable region for a.on and the green border represents the area of the p.
Right. Just getting the text to appear in the proper place was tough enough. Then making everything clickable…
Thanks for taking the time to illustrate, Steven.
Cameron I always enjoy your work and the post game break downs you offer on your completed projects. As someone who is more than a little deficient in the typography department, it would be a great help if you could offer links for the fonts you choose.
Most of them are linked to here and those that aren’t can be easily found at almost any of the vendor sites listed.
I think it looks lovely Cameron.
Avenir, ahh good font. I used that a lot last year, and Univers LT.
Lately I’ve been toying with Neue Helvetica. With the right kerning I really get a good outcome. That’s my boring wisdom.
-db
I really like the logo design. I am also looking forward to hearing more of your thoughts on the mobile web.
Hmm, I do not fully understand the logo design, and I believe having detected some usability flaws […], but the site looks attractive and apparently well-thought. Nice.
I too am currently having a wild love affair with Avenir. Nice site. I got really excited when I found this link buried in the code: http://pro.html.it/esempio/nifty/
Looks fantastic Cameron!
Well done :)
Looks good. I have to question the recent trend of maintaining separate mobile versions, however. I fail to see how it’s any different than building separate pages for Netscape and IE in the old days. I’m pretty sure it’s been determined a bad idea.
On the other hand, Moveable type can probably be used to just publish both versions, which will make managing the content duplication simple. Still, it probably makes the dogmatists see red.
beauty site…one for the bookmarks for inspiration.
only nitpick…in IE6, the logo hover flickers…need to place the logo as a background image behind the logo to prevent. not that you don’t know that already. :)
Scott - That’s an issue must be addressed (sep. mobile version) in any mobile strategy discussion. It’s one I addressed in my presentation, and I hope to readdress it here soon should time allow.
Jeem - Another helpful tip. Thanks.
Hi Cameron!
I just want to say that I really like this site! I wish I had found it earlier though since I wanted to organize my text for a project similarly as what you have done. I usually use coloured blocks or borders/lines to separate my content. I find it difficult to divide columns of text and make it look “clean” but you did such a wonderful job on this site! I really like the use of white space, the colours, and everything else in it!
Thanks again for providing yet another great inspirational site on the web! :)
Visually it’s a very nice site - well structured, clean, and crisp.
There are some downsides, however. I’m particularly talking about accessibility in terms of a lack of text scaling (in IE).
Other than that, I like it!
Great site cameron. I guess you finally got your ‘white’ design in! Very nice.
Nicew job Cameron. Sites like this show why you’re in the upper tier of web designers (end of shameless praise). I’m curious on your choices for the color scheme. Just my opinion, it seems orange has become the color of choice, especially in technology and the web. I in no way mean that as a critique, just an observation. I recently developed a logo design for an engineering company and used almost the exact same colors. When and how did orange become so popular? And don’t blame Zeldman.
Must be the Dukes O’ Hazzard theme dictating my every move of late…
I dig it, Mr. Moll. All of the sudden, I want to learn English. Again.
Most impressive is how you managed, through some sort of wizardry, to tame the mess that Windows makes of bold Lucida Sans. Such a great font, but—perhaps its just me—the way XP renders it in bold has always salted my grog.
Authentic Boredom is the platitudinous web home of Cameron Moll, freelance new media designer, author, and speaker. More…
Full-time and freelance job opportunities. Post a job...
A selection of fine reading, available for a limited time only:
- Jobs home page reorg
- Coming soon: Mobile Web Design, the book
- Dyson ad: Text as more than just words
- Setting sail for Europe
- Review: Sumo Omni bean bag chair
- Dashboard widget for Authentic Jobs
- Limited-time offer: $99 listings
- Nine skills that separate good and great designers
- Fire sale
- Introducing AuthenticJobs.com
CSS Mastery: Advanced Web Standard Solutions A solid round-up of indispensable CSS design techniques by Andy Budd, Simon Collison, and Cameron Moll.
Mobile Web Design A guide to publishing web content beyond the desktop. Tips, methodology, and resources. Now available.
Letterpress Posters The unassuming beauty of a freshly letterpressed print.
That Wicked Worn Look. Techniques for that worn, aged, distressed look.
Mister Retro Machine Wash Filters Turn the dial to “Instaworn” with these filters.
Blinksale Dive in and enjoy shamelessly easy invoicing from Firewheel Design.
Basecamp My preferred web app for internal and client project collaboration.
HOW Conference Austin, June 24–27. Pentagram, Adobe, P&G, et al.
Web Design World Seattle, July 20–22. Practical sessions on web design.
Stimulate Salt Lake City, September 2009. Entrepreneurship and design conference.
Linkage:
Follow me: 
1 Hercules Papatheodorou ~ 19 July 2005 at 01:26 PM
Really nice, simplicity is a virtue and seem to master it well.
One small bit that made me post: in Opera 8 (latest build) there’s a horizontal bar (1024x768). I have no time to see why it happens right now but it may as well be some Opera bug.