|
Claudio Guglieri 在纽约广告公司 B-Reel 任职总监，他撰写了本网站设计培训指南，通过分享自己多年从事设计工作中看到的一些常见错误，尤其是“网站设计培训”中所述的实习生和新手们的通病。来帮助您了解设计网站布局的全过程。 01. 先在纸上整理思绪 世界各处城市插图系列简笔 此条显然很重要，但是我经常发现一些设计师会跳过这步直接使用 Photoshop CS6 而不去思考他们需要解决的问题。设计的目的在于解决问题，而这些有待解决 阿的问题无法通过渐变或阴影效果得到解决，而是需要完美的布局和清晰的结构。想一想内容、布局和功能，然后再开始上阴影效果。 02. 从顶层框架草图入手 UX sketch 草绘基本的框架将帮助你解决 UX 问题，并组织布局结构 如果我要做一个项目的外观和感觉，第一件事就是先建一个顶层框架，可解决所有设计问题。框架是指内容周围的 UI，有助于执行操作并进行浏览。其中包括导航和各类组件，例如边栏和底栏。如果你从这点着手设计，则设计主页以外的部分时，布局内容将了然于心。 03. 为 PSD 添加网格 以 10 像素基线绘制的 978 网格示例 这步操作非常简单。在 Photoshop 中着手设计任何内容前，你需要创建一个合适的网格。这一步的道理众所周知，如果你没有这么做，我可以断言，最后的设计总是无法尽善尽美。借助于网格，你能安排不同部分的布局结构;还能指导你按照特定屏幕尺寸要求进行设计，并能帮助你创建相应的模板，以便符合间距和其他设计问题。 04. 选择排版样式 根据常规经验，一个网站布局中所用字型最好不要超过两种。了解不同的字型和配色是项目开发阶段的工作。我建议一个网站中所用字型不要超过两种，不过实际上，还需取决于你可用的色系。总之，所选字体需便于阅读大量文字，且与标题和操作相映成趣。大胆使用大字体，并在使用字型时保持整体一致性和生动感。 05. 选择主题颜色 使用有限的色阶和色调以免产生视觉疲劳。 选完要使用的一系列字型后，你应开始研究 UI、背景和文本该用什么颜色。关于颜色，我建议在处理常规用户界面是用色及色调需简洁。根据元素功能在设计 UI 时保持一致性非常重要。想想 Facebook、Twitter、Quora 和 Vimeo 之类的网站布局。除 UI 外，插图或图形细节部分只要没有干扰组件功能的话，在用色方面也没什么限制。 06. 区分规划 网站规划越简略，用户阅读时就越便利。网站各个有些都需求发扬各自的效果。关于用户而言，每个有些都有各自存在的理由，并能得到相应的结尾成果。规划需求协助侧重其内容侧重显现该有些最重要的信息。实际上，一个页面并不需求太多调用按钮，因而每个内容都应推动到结尾“我能够在此完成啥意图”。考虑一下，你能够为一个简略的方针构想到的最简略的规划，并开端添加所需组件。最终你会惊喜的发现简练也并非易事。 07. 从头考虑已建内容 咱们真的还需求一个查找按钮吗?在大多数情况下，答案是不。 作为规划人员，咱们构建了用户阅读互联网的方法，需求采纳多少过程才干履行一个简略的操作以及网站的复杂性都是由咱们来决议的。咱们一向都在遵从一些规划形式和常规，由于它们切实有效，但有时分仅仅由于没人有满足的时刻进行衡量或许从头考虑。从头考虑组件上已建的交互形式，并看看是不是能够进行改善，这点至关重要。 08. 自我应战 我鼓舞每位规划人员不要故步自封，而是在每个项目上进行自我应战。并非每个项目都需求立异，因而，需求咱们自个决议是不是要添加一些交互规划有关的内容。比方，各种自我应战能够包含运用新的网格体系、创立新的组件，或许乃至包含一些小应战，比如防止混合形式或许防止运用特定的色彩。 09. 注意细节 正在进行的游戏项目：细节视图 这条也算是老生常谈了，但并非始终在成品中得到应用。根据项目的概念，“关注点”也会有所不同。可以注重小型交互、意想不到的动画或审美感受，例如按钮上的小渐变或是背景盒子周围的微妙笔画之类。但是总的来说，如果你乐在其中，这种感受非常重要，而且非常自然。 10. 认真对待每个组件，就当参加设计比赛 注重每个组件，一加一大于二 我必须承认这并不是我首创的理论。过去曾在 Fantasy Interactive 上听到这种说法，当时我就震惊了，这句话如此明确中肯。每个组件都需单独设计，使其卓绝超凡。有时候，设计师会将一些部分归为最不重要的内容，最终并不会对其引起重视。 11. 提高设计作品清晰度
避免出现像素模糊的现象，尝试正确设置笔触效果和背景之间的对比度或背景颜色 除美学考量之外，有些共同的问题需要予以避免，从而创造出一个干净正确的作品。尝试提高设计清晰度时应注意以下几点：梯度条带、模糊的边缘、字体渲染选项(部分字体取决于字体大小，最好在特定的渲染模式下查看)以及与背景融合的笔触效果。 12. 整理如果你通过 Photoshop 进行设计，那么这点至关重要(结合网格使用)。无论项目有多大，有多少设计师参与其中，你都需要保证文件干净。这样就能保证不同部分都能轻松导出，从而提高设计流程的速度，并能处理与其他设计师共享的文件。 13. 设计最好的情况，但为最坏的情况做准备 谨记不同设备和尺寸大小上如何让你的设计发挥作用。 作为设计师，我们的工作就是通过不同的限制解决问题。网页设计过程中，会遇到各种限制，包括概念和技术问题以及内容相关的问题。我们需要创建一个网站，其不仅可以在理想状态下运行，同时也可以在最糟糕的环境下运行。例如，用户可使用相当小的屏幕查看网站，此时网站上的内容看起来支离破碎。 但是，鉴于我们展示设计作品的目的，我个人强烈建议为其创建最佳环境。因此我们将要显示最理想的内容量，同时以最佳浏览器尺寸进行展示，也就是用户最常用的环境。 14. 沉迷于设计，因爱生恨 如果你钻研设计，我保证你已经干过这种事。只要完成一项设计就会倍感自豪，设计已经成为生活的一部分了。还会截图，与其他设备比较，将其设为桌面背景，甚至打印出来挂在墙上。 整个过程中，我达到某个临界点，最终产生厌恶;我开始发现各种缺点和错误，然后进行修改。不喜欢自己以前的设计是成熟的表现，也就是说，你最终发现自己的问题。 15. 与客户沟通前防止浪费太多时刻规划概念 提交交互概念或规划外观与体会时，你需求保证你和客户赶快同步。初始概念经过审阅后，你可以稍作放松，然后开端规划。 可是假如提交后初始概念后，并未深得客户的欢心，你就应该搜集各种反应，以便第2次提交的概念计划可以契合客户的需求。 16. 和你的开发者成为老友 纽约广告公司 HUGE 的 Rafael Mumme 就规划师怎么十分好地与开发者协作的提出的主张。 开发者构思十足，并且酷爱自个的作业，和你相同。可是他们并非总是在项目一开端就参加其间，并且大多时分，他们都是在概念规划敲定之后才开端参加规划的，因而他们的构思作业就遭到了扼杀。这种流程是过错的;一些十分优异的主意都是开发团队提出的。共享你的概念，你会惊喜地发现他们会把它成为愈加漂亮、愈加便于规划。 17. 展现：说明时请将受众幻想为四岁孩童 展现著作和规划著作相同重要。运用过错的展现方法，可能会沉没优异的规划或许使其惨遭筛选。谨记，受众首次看到你的规划时，并不知道你了然于心的各个要点。 18. 肯定自己的创意，但不要成为其奴隶 了解何时宣传自己的创意，或是了解团队或客户何时会产生分歧，这里存在一个小小的临界点。作为设计师，你需要坚信自己的设计，但是你也应乐于接受他人意见，快速改变自己的创意以及展开后续调整。不要忘记条条大路通罗马。 19. 开发过程中跟进设计 如果您在广告公司中工作，你必须明白，虽然你刚刚完成的一个项目已经投入开发，你不得不参加另一个新项目的设计，这是家常便饭。大家普遍认为 PSD 和样式表提交后就万事大吉了，这是不对的，其实一切还刚刚开始。如果你真的关心自己的设计和交互理念是否完全贯彻，可以实时与开发者友人沟通，并尽量提供帮助，以便达到至臻至美的效果。 20. 逐步正在设计的作品 与大家分享样式表和正在设计的组件 作为设计团队的一员，我们不仅希望看到最终的成品，同时也想看一看正在设计的作品。有时候，出于种种原因，项目最优秀的部分可能会被忽略，然后一直存放在归档文件夹中。项目完成并获得客户/制作方认可后，可以着手进行改善，如有可能，可以创建案例研究，分析设计中的作品以及最终并未采用的作品。这有助于帮助拓宽团队知识，同时你也能收集宝贵的反馈意见。 Claudio Guglieri 目前在纽约国际电子广告公司 B-Reel 就任艺术总监。之前在 Fantasy Interactive 任艺术总监，负责领导和制作客户端交互体验，如 Google、EA CNN、Nikelodeon、History Channel、Range Roverand Microsoft。 |
|
|
来自： 昵称16304329 > 《我的图书馆》
