Wan't a colorful and nice design for a new Habbo fansite. Should have a twist of Habbo and Web 2.0.
We´re making a new fansite for Habbo [http://www.habbo.com], which is a virtual hotel on the net. You can think of it as a game without fixed rules.
It’s about self-expression, playful interaction, creativity and making friends. It’s mainly for teenagers between ages 12-16.
The overall look and feel of Habbo is happy, friendly, humorous and imaginative. The style does not try to follow the latest trends; it’s pure pixel style that has its roots in retro computer graphics.
Examples of nice Habbo fansite designs for inspiration:
Screenshot from our current design (little boring):
Please try to keep the set-up as it are, but just with new graphic elements. We like it this way:
Logo at the top, a box somewhere in the logo to latest news.
Menu in left and right side.
Copyright line at the bottom.
Questions? Just ask! :-)
- Keep it pixelated
Habbo is about pixel graphics. Everything is drawn pixel by pixel by hand. Antialiasing should not be used anywhere in Habbo environment. Pixel look keeps the overall look unified and crisp and it also makes it technically easy to place characters and other elements on top of different backgrounds.
All individual elements should have a black outline.The black outline is there to keep different elements clearly separate.
Habbo is colourful. But it’s not a complete rainbow; the full colour spectrum isn’t used. For example bright cyans or purples should be avoided. Keep it colourful but don’t overblow it. Usually it’s better to choose two to three main colours in your design. Opposite colour pair such a an orange and a blue is always a safe bet.
- Gradients and smooth shadings
Even the smoothest shadings in Habbo should not have smooth colour gradients. Keep it 8-bit, dithered and use your imagination to come up with creative solutions. A good rule of thumb for the amount of colours is that two adjacent colours in a gradient should always be recognizable as two separate colours when seen side by side.
- Dithering and textures
Best dithering method for Habbo is manual pattern dithering. It requires some work, but gives the a nice, clean look and brings the surface alive. Don’t use automatic pattern or
diffusion dithers as final results. Sometimes they may be useful for quick pre-dithering but clean it up manually afterwards.
Habbo has a pixel font of its own, Volter. It comes in size 9, in plain and bold. Volter should be used in all digital pixel environments when the text size is small (9 pixels)
and there are no technical limitations to it. In some cases a doubled 18 pixel Volter can be used as well.
Don’t use real-world photos in Habbo pixel environment. They just don’t work in there.