优秀的网站布局

优秀的网站布局

ID:45799686

大小:573.46 KB

页数:13页

时间:2019-11-17

优秀的网站布局_第1页
优秀的网站布局_第2页
优秀的网站布局_第3页
优秀的网站布局_第4页
优秀的网站布局_第5页
资源描述:

《优秀的网站布局》由会员上传分享,免费在线阅读,更多相关内容在工程资料-天天文库

1、01.先在纸上整理思绪世界各处城市插图系列简笔此条显然很重要,但是我经常发现一些设计师会跳过这步直接使用PhotoshopCS6而不去思考他们需要解决的问题。设计的目的在于解决问题,而这些有待解决的问题无法通过渐变或阴影效果得到解决,而是需要完美的布局和清晰的结构。想一想内容、布局和功能,然后再开始上阴影效果。02.从顶层框架草图入手草绘基本的框架将帮助你解决UX问题,并组织布局结构如果我要做一个项目的夕卜观和感觉第一件事就是先建一个顶层框架可解决所有设计问题。框架是指内容周围的UI,有助于执行操作并逬行浏览

2、。其中包括导航和各类组件,例如边栏和底栏。如果你从这点着手设计,则设计主页以外的部分时,布局内容将了然于心。03.为PSD添加网格以10像素基线绘制的978网格示例这步操作非常简单。在Photoshop中着手设计任何内容前,你需要创建一个合适的网格。这一步的道理众所周知,如果你没有这么做,我可以断言,最后的设计总是无法尽善尽美。借助于网格,你能安排不同部分的布局结构;还能指导你按照特定屏幕尺寸要求进行设计,并能帮助你创建相应的模板,以便符合间距和其他设计问题。04.选择排版样式根据常规经验,一个网站布局中所用

3、字型最好不要超过两种了解不同的字型和配色是项目开发阶段的工作。我建议一个网站中所用字型不要超过两种,不过实际上,还需取决于你可用的色系。总之,所选字体需便于阅读大量文字,且与标题和操作相映成趣。大胆使用大字体,并在使用字型时保持整体一致性和生动感。05.选择找颜色使用有限的色阶和色调以免产生视觉疲劳选完要使用的一系列字型后,你应开始研究UI、背景和文本该用什么颜色。关于颜色,我建议在处理常规用户界面是用色及色调需简洁。根据元素功能在设计UI时保持一致性非常重要。想想Facebook.Twitter.Quora

4、和Vimeo之类的网站布局。除UI夕卜,插图或图形细节部分只要没有干扰组件功能的话,在用色方面也没什么限制。06.划分布局Innm-AtioninStor)1ellingandTechnology・DIGITALCOMMERCIALSTV■—pwC■皿FEATUREFILMSPRODUCTS网站结构越简单,用户浏览时就越方便网站各个部分都需要发挥各自的作用。对于用户而言,每个部分都有各自存在的理由,并能得到相应的最终结果。布局需要帮助强调其内容着重显示该部分最重要的信息。实际上,一个页面并不需要太多调用按钮,

5、因此每个内容都应推动到最终〃我可以在此实现什么目的"。思考一下,尔可以为一个简单的目标构想到的最简单的布局,并开始添加所需组件。最后你会惊喜的发现简洁也并非易事。07.重新思考已建内容我们真的还需要一个搜索按钮吗?在大多数情况下,答案是不。作为设计人员,我们构建了用户浏览互联网的方式,需要采取多少步骤才能执行一个简单的操作以及网站的复杂性都是由我们来决定的。我们一直都在遵循一些设计模式和惯例,因为它们切实有效,但有时候只是因为没人有足够的时间进行衡量或者重新思考。重新思考组件上已建的交互模式,并看看是否可以进

6、行改进,这点至关重要。08.自我挑战我鼓励每位设计人员不要墨守成规,而是在每个项目上进行自我挑战。并非每个项目都要求创新,因此,需要我们自己决定是否要增加一些交互设计相关的内容。比如,各种自我挑战可能包括使用新的网格系统、创建新的组件,或者甚至包括一些小挑战,诸如避免混合模式或者避免使用特定的颜色。09.注意细节正在进行的游戏项目:细节视图这条也算是老生常谈了,但并非始终在成品中得到应用。根据项目的概念,〃关注点〃也会有所不同。可以注重小型交互、意想不到的动画或审美感受,例如按钮上的小渐变或是背景盒子周围的微

7、妙笔画之类。但是总的来说,如果你乐在其中,这种感受非常重要,而且非常自然。10.认真对待每个组件,就当参加设计比赛注重每个组件,一加_大于二我必须承认这并不是我首创的理论。过去曾在FantasyInteractive上听到这种说法,当时我就震惊了,这句话如此明确中肯。每个组件都需单独设计,使其卓绝超凡。有时候,设计师会将一些部分归为最不重要的内容,最终并不会对其引起重视。10.提高设计作品清晰度★★★esomecontrols,Iwishphonetoo!★★★esomecontrols,Iwishphone

8、too!lews(24total)避免出现像素模糊的现象,尝试正确设置笔触效果和背景之间的对比度或背景颜色除美学考量之外,有些共同的问题需要予以避免,从而创造出一个干净正确的作品。尝试提高设计清晰度时应注意以下几点:梯度条带、模糊的边缘、字体渲染选项(部分字体取决于字体大小,最好在特定的渲染模式下查看)以及与背景融合的笔触效果。以上列出了一些基本注意事项,但实际上需要注意的问题还有很多。务必以整体视

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。