• Add to Collection
  • About

    About

    Website design of developer's club
    Published:
Developers' club - Design process

Demo (Simplified Chinese): 
 
The goal
The organizer of China's HTML5 Dreamworks gave me 99% freedom to create a promotional site for a new developer's club. The goal of this website is attractintg potential members to join and presenting information about the upcoming meetups. Different from its parent site - HTML5 Dreamworks is mainly for tech and news - this site should has everything the after-work life is like, full of fun.

My Role
- content strategy
- web design
- front-end develop
Visual identity
Besides the 99% freedom, the requirement of this job is that the site should be consistant with its parent site, using the same logo. 
 
The parent site is very formal, while this one is for fun. The colors could be vibrant, bright, even contract colors would work. I like the red and orange in the logo. But there are too many other colors that could go with these two. I decide put this aside and move on to design of the header.
Illustration and color scheme
There's no images from the client, which means I must search or create something. Instead of searching for a photo of developers, why not draw a developer? I'd like to try something new, such as a vector illustration going well with the sharp vector logo.
 
The image of a geek coding in front of a computer is such a stereotype for developers. so I start with a monkey (which is another stereotype) who wants to go outside. Blue sky, white clouds, basketball ... what I finally got is a monkey, a little bit geeky, steping outdoor, inviting YOU to join him.  *the flag says "Dont stay at home" 

Thus the sky blue comes into the final color scheme.
Web design

- Icons
I cant stop draw after drawing the monkey. this new club holds seminars, instrument learning, trips, even speed dating! For each type, I need a icon. I want to demonstrate the changes after joining this club.
 
 
- Consistant details 
Details and Subtle animation adds fun. 
- Responsive layout
The site should be a responsive site as the main promotion goes on Weibo and Weibo users are very much likely to use mobile devices.

By-product