Sometimes, in rare times, I’d then come across website design that can make me cry. Not because that they are nice, But because they are f******g nice.

Recently, a post Smashing Magazine made me do just that. It posted an article by Torley Wong’s on great user interface ideas. (Link to original – “Creative User Interfaces in Modern Web Design” here).

I decided to check all of the websites out. And most of them really truly inspired me that I had to share with the team here. I’ve replaced the author; Torley Wong’s article with mine below. Feel free to visit the original article and read up on his thoughts. Some sites have also been omitted from my updated version as I believe, after checking the works, they did not really fit into the context of user interface design from the perspective that I am writing on.

Hope you enjoy it. And to the design team working with me, hope you are all truly inspired to go create stuff as good as these.

OkayDave

Dave Werner’s website is not new. It’s been around since 2006. And I first saw it was back then. Yet even till now (now being 2008) it is still innovative and ahead of the curve. What is more surprising was that he had created this site as part of his portfolio piece for his graduation. Yes. His student work kicks more ass than most industry veteran designers combined.

Dave Werver

Vimeoland

Vimeo is cool. Vimeo with HD is cooler. Vimeo with VimeoLand is coolest. Vimeoland is like watching a cartoon show with characters going around speaking in videos. This is probably experimental and a fun side project by the staff. But heck, it’s a way to show videos to the short-attention-span, visually oriented group.

vimeoland

Grooveshark

I used to like Pandora. Then I used to like Last.FM. Then after that I like Imeem. Now I like Grooveshark. Apart from the large artist repository and rare music (I tried Sinnerman* by Nina Simone).

*Side note: Nina Simone’s Sinnerman = Nokia = Tipping Point. Ask me what I mean by this.

And the user interface design. Oh My GAWD! It’s a UI designer wet dream. Beautiful, large buttons. Reminds me of the iPhone user interface. Really simple, no nonsense.

It takes a strong, very confident designer to design a user interface devoid of the usual ‘creative’ stuff like imageries and such; and only focus on the functionality of content driving the design.

Perhaps we should look at this as an example for one of our music initiatives for the company.

Grooveshark.com

SpaceCollective.org

Into spacey, trans-human stuff? Then go to SpaceCollective.Org. But seriously, subject matter aside, this site takes grid or tab-like interface to a new level. It’s nice to know that even people who thinks really out of this world thinks of other humans first when it comes to designing really usable, functional interfaces.

(Or were they thinking of animals and other non-humans when designing this site? Perhaps simple enough that even a monkey can use.)

spacecollective.org

Viewzi

Two months back, I commented that there would be a new war of the search engines. And that I just do not know in what form that they’ll be in.

Now the answer has come – Visual search.

And with visual searches comes visual interface designs designed to present these search results in a deeply considered, user-centered creative approach.

Again, this will take a very confident designer to create interfaces that’s simple and puts content as the hero over the usual visual fluff.

viewzi

Like.com

Another dice thrown into the visual search table game. This time by Like.com. And this time I’m not too sure how this type of visual search will pan out though.

Unlike Viewzi, where you type in your search keywords and it returns you the results in a visual display, Like.com searches by the images you send it and it searches for like-wise items. Preferably, one or more of them being what you’re looking for.

I’m just not too sure how simple or smart it will be for the really novice users though. It is a smart engine. But perhaps a little too smart for now. Too ahead of its time. Like Boo.com was a decade ago. Not usable now. Maybe later.

What I do like about Like.com though is in its visual array presentation format. This one I like a lot. If you’re looking at a smart, clean visual presentation format of many (tens to hundreds) of items in a e-store site, Like.com is the perfect fit.

like.com

Navigaya

Oh another Visual Search have we? Yes we have. This time by Navigaya. This time better than (although in similar presentation format) Viewzi. And definitely way better than Like.com. In my humble opinion.

Like Viewzi, it starts with a simple search bar. And the results are presented bang on, large on center screen. What makes Navigaya better is how subtle things are or becomes. After a certain time of inaction, everything fades off. And comes back on again when the mouse is moved. This keeps focus only on the item at play and keep non-essential item in the background, appearing again when called for. Again for the strong designer who knows that the strength of a site is in its content.

It does have its drawback. In that it’s not as clean and sleek as Viewzi. But I think it’s catering to a visually oriented target market. The kind who likes to see eye candies and bursting bubbles move about.

navigaya

GoDesignate

I would not label GoDesignate as design. But if user interface design is all about user interfaces that is functional, then GoDesignate is it.

Basically I’d say that there are two forms of user interface design. First is visual-related. Most creative designers (including most of you in my team) are visual designers. Second is functional-related. Not many designers are functional designers.

I would relate functional designers as being those designers that have elevated themselves to a state where, integral to their designs are the visual cues that emerge in the user’s minds. Functional designers design for a symbiosis of the user and the product to become one. Usually the design would be simple, with a focus on getting the user to using the product better.

Ok. Enough of the mumbo-jumbos. Here you go… GoDesignate’s functional simplicity.

godesignate

Hypnoteis

While on the topic of Visual vs Functional designers. This next one marries both. Teis Albers designs are visual intensive montages that represent the trend now. Something I personally love.

Yet his showcase website goes beyond visual fluff and focuses on simplicity of use. Again the focus is on content being the hero of the design. Going with the principle that while the content itself is loud, the container is simple. And vice versa.

hypnoteis

Serge Seidlitz

But then, sometimes as a designer, you might want to make visual fluff. You REALLY want visual fluff as the hero. To you, your work should be the focus. That’s what Serge is doing.

Unlike Hynoteis where the work is separated from the interface, Serge’s site is a montage of his work. And it does so intentionally. Yet even so, amidst the visual complexity, comes the simplicity of use. You get what you click. No mouseovers. No fancy overlays. Proof that design complexity can also be simple to use. While the design is complex, the function is simple. Vice versa to the above site.

It’s like order in chaos. I LIKE!

serge seidlitz

Six Pixels of Separation

If I were to design a blog; this would be it. If I were to write insights and article; this would be it. If I were to architect information; this would be it.

Basically, Mitch Joel is doing what I would have exactly done. Except that he’s been doing it way more than me and is probably doing it more often than I get to do. What would otherwise have been a content heavy website, with too many links to too many places is very well organized.

Graphics are used sparsely to maximum effect. Using them to provide information and drive users to deeper content. Even if one were to not read much and scan only for headlines and keywords, one would be relatively successful at it.

six pixels of separation

Fontpark 2.0

It’s like typography. Only, with Japanese Kanji characters. Only with Kanji turning into actual characters. Like an actual character. Like a face. A Font Face. Yes really. A Font, that’s like a Face.

I would not have classified this site as good user interface design. It’s more creative than good. But the fact that it got me mesmerized for a good 10 minutes after the site load really speaks much for itself. Just sitting here watching the artwork and stories unfold was just amazing.

One can’t help but feel a sense of zen-ness by visiting the site here.

fontpark

Bestiario

If in case you don’t know, there is one field that many open-sourced sites are really getting into and experimenting much lately – Data Visualisation. Basically is a fairly new field in the online space where more and more efforts are being put into in the area of developing online applications to crunch and present massive complex data visually.

It’s like answering the pertinent questions of “Great, but how do these numbers connect? And what do they represent?” that most of us ask when given stacks over stacks of excel spreadsheets.

bestiario

The above are examples of great, creative interpretations in user interfaces design. While the designs and executions may vary from one designer to another, the concepts and principles remain the same – that great web design must be usable and a joy to use.

LogoPond.com contains nearly a thousand inspirations towards brand and identity design. Top notch identity work from skilled designers. Enjoy!

Noticed taht in the top 10 websites, the design is focused on bringing the beauty of the content forward. Style is minimal, yet when doing so, it made the site so much more visually striking.

1. guardian.co.uk

2. BBC – Homepage

3. Wired News

4. UX Magazine – The User Experience Magazine

5. Vanity Fair: vanityfair.com

6. The New York Times

7. Frieze Magazine

8. New York City News Service

9. The New Yorker

10. CNN.com

11. National Gazette

12. TIME.com

13. The Morning News

14. Grand Sierra Magazine

15. Economist.com

16. JPG Magazine: Your World in Pictures

17. La Repubblica.it

18. Salient.org

19. FILE Magazine – Unexpected Photography.

20. Azure Magazine

21. art and design magazine

22. CREATIVEurope

23. washingtonpost.com

24. Archfarm: Non-periodical fascicles on architecture

…also worth a look…

25. Schematic.com

26. Creative And Live

27. Reform and Revolution

28. Slate Magazine

29. Peshku pa uje

30. Computerworld

Campaign: Renuar
Creative Agency: Mccan IL
Advertiser: Renuar
Ad Format: Expandable Banner
Vertical: Apparel / Retail
Country: Israel

Don’t miss it.. its here

It has been a while since I saw simple yet good design like this. Some of you might have viewed it in FWA but for those who missed it, please visit their site!

Website is HERE !

The list below is for the best sites to download free vectors. Be sure to subscribe to their RSS feeds to get alerted when new vector art is uploaded.

Vecteezy
Huge index of free vector art that is comprised of vector art submissions from hundreds of designs which you can download for free.

Cool Vectors
Growing art gallery with vector art downloads you won’t find anywhere else!

GoMediaZine
Blog of a famous design studio that takes the time to create free custom graphics.

QVectors
Great vector art gallery that has many super high quality free vector art downloads.

Vector4Free
This vector blog publishes new free vector art finds on a regular basis and has a large collection of posts built up already!

Vectorportal
Helping hand to everyone who works with vector graphics through free vector files, tutorials and news from the industry.

You the Designer
Graphic design blog that often releases high quality vector art sets.

Vectorart.org
Free vector illustration file downloads. Full use of the .eps and .ai files. All our vector art downloads are free.

FreebiesLinkShare
Place to share your freebies links, so you will gain more visitor to get your freebies, you can browse and vote for freebies from the other people too. Free Vector, Free Icon, Free Font, Freeware, Free Scripts, Free Sweeptakes, Free Gifts and more.

FreeVectors.net
Massive vector art gallery with hundreds upon hundreds of free vector art submissions available for download.

BittBox
Solid design blog that often releases free vector graphics, fonts, textures, brushes and more.

Blog.SpoonGraphics
Blog that most focuses on Illustrator tutorials and you can often discover free downloads on this illustration blog.

Dezignus
Personal playground for digital creations and share links for design stuff with fellow designers and artists.

See the process on his blog at James Jean Art + Commerce.

Ejen Sinar is basically Sinar fm on-ground team. It’s similar to hitz.fm cruisers, Skuad ERA Avanza, mixfm Roadrunners, etc. We have came out with a fresh new look for their special page in sinar.fm where we have decided to use a comic look-and-feel for the whole section.

HERE IS THE NEW PAGE!

Like all retro comics, Ejen Sinar members have their secret identity or what they used to call, “alter-ego” and that’s when they become AMP Sinar X as a team of superheroes. Well, they are actually Sinar fm very own paintball team ;)

We haven’t officially introduced AMP Sinar X, but here’s a sneak peak of their page.

Stay tuned.

You can still view the previous Ejen page here, it’s not available to public anymore as of yesterday.

So, what do you guys think? :)

This time, into Smashing Magazine. Read full article here. Dive straight into point 5 – Hand Drawing Used Extensively and you’ll find his work among other greats.

Is it time for a Joshua-Rames collab on Brainiacs at Work skin design?

view orginal here at Ads of the World

Today, I came across this site from FWA. I kinda like the simplicity of the site – the navigation and the design. And it invloves interactions from the user and but interesting presentation. To develop a good web site, UI and UX are really important (quoted by N), I totally agree! But not forgetting, good concept! :)

Want to experince the site? Just click HERE!

Straight to the point, one button navigation. Some of the featured works are really random, really funny and what I’d call “idea-food.” Hop on to www.ffffound.com

Hydro74 is a full time design studio that helps and aids various companies in the progressive market. Over the past 3 years Hydro74 has had the opportunity to work with some of the biggest names out there. The main goal is to provide the client with the best possible solution to their needs.

Don’t forget to check out their apparel, illustration and print portfolios - http://hydro74.com

Groovy illustration from Switzerland based artist and designer Michel Casarramona. Illustration of realistic anatomy of human figure will humor the audience with the comical visual. With the retro style of layout creates the visual more appealing and fun to look at.