Showing posts with label Web Designing. Show all posts
Showing posts with label Web Designing. Show all posts

5/08/2008

电子商务网站的界面规划建议

相比国内的电子商务网站,国外的网站看似效果简单,实则内涵丰富,简约而不简单,是深入研究过用户心理学的产物。电子商务网站的界面规划,有几个地方要注意:
1、 产品类别规划不但要精确,更要易懂。
类别划分要符合用户的阅读习惯,类别不是划分得越细越好,相反,同时展示给用户的大类不要超过10类,类别索引要循序渐进,不要让用户在查找类别上耗费太多时间。
2、 页面的视觉流程要清晰
1) 版块布局要大小适宜,重点突出。电子商务网站的版面规划需要做到——大小适宜,重点突出。要根据网站的重点,对于内容进行合理的版块规划,页面需要有视觉焦点,各版块大小分配轻重要合理,不能将版块都均衡分配。
2)色彩搭配要协调,主次分明。网站需要有主色与辅助色,一个网站页面上同时出现的色彩不宜超过三种,色彩主次要分明。电子商务网站应该以产品展示为主,网站色彩的运用不能喧宾夺主。
3)字体及图标的应用要节奏和谐,适合阅读。为了吸引用户在网站上停留得久些,电子商务网站不仅要有精美的产品图片,更要有适合阅读的字体。虽然网页上一般是采用默认的宋体,但是在文字的大小、间距、粗细、颜色上依然要有所考究。文字就像有节奏的音符,恰当的文字排列使得用户阅读更加舒适,不当的文字排列则降低用户的阅读兴致。节奏和谐的文字排列将增强用户的阅读时间。
3、 flash的应用要慎重。
恰当的FLASH应用能为网站锦上添花但是网站上尽量不要多个FLASH同时出现,如果有,也要设定为可关闭。要让用户在无干扰的情况下浏览网站,而不能让FLASH将用户赶跑。

4/29/2008

Becoming a Master Designer Rule Two: Limit Your Colors

Rule Two: Limit Your Colors. Sounds a lot like the last rule of limiting your fonts right? Exactly! We want to limit our colors for the same reason we want to limit our fonts. Reducing the number of colors we use in our design will make the piece feel consistent. Basically, everything will look like it goes together. Just like a sports team’s uniform or a company’s branding - we want a uniform over-all look to the colors.
As with the font selection, limiting the number of your colors is just a guide not a rule. You could very well have a rainbow of colors in your design and it will look great. But you need to start with a coloring strategy and stick with it. Use your color consistently throughout your design.
For starters lets talk about color values. A color’s value is how bright or dark the color is. A yellow for instance is fairly bright. A purple is fairly dark. Of course, a color can have a range of values. Purple for instance is a color that most of us think of as relatively dark, but you can also have a very light purple. Here is an example of some colors and their relative value. Then next to that you can see a range of values for one color.
So here is one rule I use when picking my color scheme: make sure you have a range of values in your color scheme. In any design you’re going to need some light colors and some dark colors to produce contrast. If for instance, the background of your design is dark, you’ll need a light color so that the copy can be easily read. Or conversely, if you have a bright background you’ll need a dark color for your art or text or whatever.
I will also typically only pick 2-5 colors to make up my color schemes. Reduce the number of options and you’ll typically have good results in the design. Here is a sample of a color scheme I put together. As you’ll see I picked One dark color, one middle-valued color and one bright color. Just to the right, I also set up a value range for each of these colors. It’s this collection of colors that I will use on my project as my palette. Once I have this color palette set up I will try my best to only use these color.
Ok, so now that we’ve addressed some technical color picking issues like how many colors to pick and what values they should be; what’s next? I’ll tell you what’s next, the hardest part; deciding what those 2-5 colors should be! I personally find this to be a somewhat difficult task at times. Here is a list of techniques I’ll use to help me pick my color schemes:
• Stick to a temperature range. As in… pick all warm colors or pick all cool colors. Warm colors are reds, oranges, yellows, browns, etc. Cool colors are blues and purples. I consider greens to be fairly neutral. If you pick all of your colors in one temperature range, they will probably go together fairly well.
• Use a website like www.colourlovers.com for inspiration. This wonderful site is all about picking color schemes. You can just click through page after page of color schemes.
• Keep an eye out. There are color schemes all around you. Look at packaging in the grocery store, look at the paint colors in your local Starbucks, look at Mother Nature! If you see something with a pleasing set of colors, just take a mental note and see if you can replicate it on your computer.
• Pay attention to pre-existing company colors. Frequently I am playing off of some pre-existing brand colors. I’ll look at their logo, color scheme and use that as my starting point. Then maybe just add a color or two.
Here are a finished design that I’ve done which show fairly restricted color schemes.
As you can see, the tight color scheme and limiting my fonts really pulls everything together.
I know these lessons are the basics… …but these remain cornerstones of design. So, it never hurts for a little refresher. 5 more rules to come. I promise the next 5 are a bit more interesting. Thanks for your time!

Become a Master Designer - Rule One: Limit your fonts

Part One of Seven Easy Principles to Becoming a Master Designer.
Ok, “master designer” might be a bit of a stretch – but you can at least become a “proficient designer” by following 7 easy principles. This will be the shortest, most informative series of blog posts you’ve ever read on how to become a better designer. Please note: these principles CAN be broken… these are not laws, they’re just general guides that I typically follow when putting together a design.Follow these simple design principles and you’ll be on your way to artistic excellence.Principle One: Limit Your fonts. A big part of putting together a good design, as you’ll see, is making sure the over-all look is consistent. The best way to accomplish a consistent look to your design is limiting the number of artistic motifs (themes) that you use. The fonts you select are the first variable you want to limit. I typically like to pick just 2 fonts per design.The first font can be fancy or artistic. This font will be used to give your design some flair, character and personality. It’s this font that sets the mood for the piece. Is it a fun font with swirls for a girl’s party, or is it a grungy evil font for a rock band? I would use this fancy font for the header copy – anywhere it’s big, I’ll use this font. The fancy font will be the focal point of the piece. You will usually have less copy in this fancy font, but it will be much bigger – so that’s what people will see and focus on.
The second font should be very basic. The audience shouldn’t take notice of this secondary font at all. This secondary font needs to be very easily legible. It’s this basic font that will be used for large bodies of copy. Obviously, it’s very hard to read large bodies of copy that are in some extravagantly artistic font. So, this second font is all about functionality.Here is an example of proper use of fonts in a design. As you can see, there is only two fonts used here. The fancy font is used as the headers and the basic font is used for the copy. It looks clean and consistent.Here is a Bad use of fonts. In this case I used too many fancy fonts. It just makes the piece look inconsistent. The sub sections don’t seem like they match with the main header.Having too many fonts in a design is the biggest mistake. Nothing looks worse than someone who has used 8 different fonts on their flyer. Even worse than that is using a very fancy font for your body copy. Here is a sample of font use at it’s worst:One last thought before I let you go. If your fancy font looks modern or contemporary, then your basic font should be a san-serif font. If your fancy font looks old fashioned, then use a serif font for your secondary font.