搜索
网站策划与评估—从工程学角度看待Web设计2PlanningDesignDevelopmentPublishingMaintenance网站策划的环节——生存期3网站策划与制作流程•策划须知•网页构架•图形制作•程序编制•建立文字內容•建立多媒体资料•网站管理•网站行销4策划须知•网站的构架等同于行销•活动、人力、经费、消费群•市场与商品消费：网站分析•推动策划5网页架构•网站构架图•符合策划面的事务•考虑程序网页的操作过程•考虑使用者操作习惯•与美编、程序讨论可行性•修正策划案并订出时程表6图形制作•参考相似网站•收集必要素材•统一网页风格•配合程序调整7程序制作•可依据策划独立制作•与美编部分同时进行•配合美编修正网页•随时协调更改网页8其他•建立文字资料•建立多媒体资料•网站管理•网站行销9网站策划环节（2）执行（implementation）设计（design）建构（architecture）定义（definition）10网站策划与制作流程（2）烩办だ猂定义建构设计执行格式化的评估FormativeEvaluation界面设计InterfaceDesign转换协议ConversionProtocol原型产品Prototyping故事板Storyboard运行行为RuntimeBehavior表示设计PresentationDesign关联性设计InteractivityDesign身份（特性）与信息设计Identity&InformationDesign主题分析SubjectAnalysis硬件选择Hardware领域分析DomainAnalysis软件选择Software11主题分析•使用者分析•策略•內容•开发工具与科技•日程安排12使用者分析•确立目标•确定受众13策略•定义要在网站中传达的信息;•策划如何让网站的使用者接受所要传达的信息•基调的选择;•选择一种能够有效地表达目的的视觉或者语言方式.14内容•确定信息内容•利用独特的方式、恰当的Web技术规划信息•网站的设计一定要适合多数用户的欣赏能力15开发工具与技术•审视下列工具（技术）的优缺点(举例)–HTML–CSS–Frames–ScriptingLanguages(CGI,VB,etc.)–JavaApplets–PHP/ASP．．．16日程安排•进度时间轴17领域分析•根据不同的网站要求，搜集信息。•对不同素材与信息加以分类整理。•针对各细项，拟定呈现内容与策略。•详列制作上所需的技巧。18选择硬件与软件•以下提供一软硬件环境的范例，策划目标为开发影像数据库系统。•系统开发工具•操作系统--Windows2003Server•WebServer–IIS6.0•JavaServlet&JSP--Resin-2.0.1&JDK1.3.1•数据库•MicrosoftAccess2000•SQLServer200019选择硬件与软件•影音处理–Premiere6.0–RealProducer8.0•系统使用环境–WebBrowser--IE,Firefox–CPU–2.0GHz或以上–RAM–1GMB或以上20设计流程21故事底板稿范例（设计）頁數：________________企劃名稱：__________________________程式撰寫人：________________負責成員：__________________________修訂時間：________________頁面設計（約略畫在這個舞台上）動畫效果：_______________（請填寫動畫底稿做細部描述）影音視訊：_______________（請填寫視訊底稿做細部描述）以下為鏈結部分，填入檔案名稱（文字部分）文字：_____鏈結檔：________文字：_____鏈結檔：________文字：_____鏈結檔：________（未完）以下填入顏色代號或檔案名稱背景：__________________（圖形、圖像、按鈕、動畫部分）LINK：__________________圖檔：_____鏈結檔：________VLINK：__________________圖檔：_____鏈結檔：________ALINK：__________________標題：__________________（圖形對應部分）內文：__________________圖檔：_____鏈結檔：________BULLET：_____________鏈結檔：________鏈結檔：________以下填入檔案名稱或內容副題：__________________________________________________________________（影音視訊鏈結）______________________________________影音：_____鏈結檔：________________________________________________內文：____________________________（窗框部分）______________________________________窗框名：_____鏈結檔：______________________________________________窗框名：_____鏈結檔：____________________________________________________________________________________以下為互動設計部分，詳填功能、標記與旁白：_______________對應語言（如CGI、JAVA、VB等）音樂：___________________________________________________尚未製作，來源：____________________________________________________（請填寫音效底稿做細部描述）____________________________________大概描述页面的长相22原型•原型是正式产品推出前，大致完成的作品，很多应用程序有所谓的Beta版，意义和原型很像。就网站而言，如果你帮某系设计网站，当初步设计完成后，就要进入一连串的测试与评估，此时便是原型，在确认所有问题都修正后才正式上线。23评估•发展中评估–格式化评估–通常是专家评估或是小范围调查测试•推出后评估–综合评价–线上回馈或大规模调查等24网站设计的宗派•AndrewChak–整体哲学观点驱使设计者寻找超出Web之外的解决方案并根据顾客的需求进行设计。•AlanCooper–倡导人性化和个性化的设计。•Davis和Laroche–提倡包容性，鼓励将艺术、结构和内容融合进Web的设计中。•JakobNielsen–这位Web设计传教士藉以参加神圣的设计巡回布道大会分享他的设计理念。•JaredSpool–与一直在寻找但始终未找到诚实人的希腊哲人Diogenes类似，JaredSpool从来没有发现面面俱到的好网站。25AndrewChak•一个设计者需要看到一个网站的所有竞争对手。竞争不只是来自另一个网站，也来自现实生活。因此，如果网站不优于现实生活的话，人们就不会使用它。•Chak的三大设计原则是：•快速的页面下载•直觉的导览•精致简约的设计。26AlanCooper•一个所谓优良的设计是建立在对广泛的人类共通性和特殊群体的个别意向的深刻理解之上，因此它可以对适当的信息、过程和技术进行排序，从而可以使那些特殊群体达到他们的专业和个人的目的。•Cooper的三大设计原则是：•精简的设计•健全、快速的页面下载•无误的除错管理27RobertDavis&PaulLaroche•真正成功的使用者接口设计是经过深思熟虑并以使用者为中心的系统或经验设计的自然扩展。•Davis、Laroche设计原则是：•有效（effective）和迷人（sexy）并不互相排斥。要有勇气去重新定义所谓「酷」的含义，将成功（successful）和直觉（intuitive）这两大因•素包含进来。28JakobNielsen•它在您需要考虑的几乎所有因素方面一直都表现得很好。当您在不同的页面上时，您知道您要做什么。一直在改进设计，但是却一直以使用者经验为出发点。•Jakob的三大设计原则是：•精致简约，越少越好•支持使用者任务•不要阻碍使用者29JaredSpool•在设计得最好的网站上浏览时，网友究竟有多少时间能够成功达到他们的目标呢？」根据Spool的观察，答案是42％。根据Spool简单而保守的推算，「所有的网站都是失败的。」•Spool的四项设计原则是：•–了解网站的目的•–了解使用者的目的•–确保所刊登的内容能达到目的•–确保所刊登的内容能达到目的30经验设计•先躯为NathanShedroof。•经验设计涵盖从美学、互动、价值与意义、品牌、时间、动机、架构、控制、语言、回馈、资料、个人化、商务等不下数十种元素，这些元素都可能影响到设计的结果，是否能真正符合使用者的需求。因此，我们谈网站或网页的设计，从表象上看来似乎是一种艺术、视觉的设计，但如果只着眼艺术与视觉设计的表现，绝对不会是评估一个专业网站规划及设计公司最好的角度。•虽然好的网站设计需要经验丰富的设计者，然而经验设计中所谓的「经验」，是指「使用者」的经验，而非网站「设计者」、「拥有者」的经验。也就是说，经验设计的精神就是，站在使用者的角度、观点、心态来设计网站或网页。31设计前的研究课题•使用者是谁？•他们在网站上可能发生的经验是什么？•这些经验会在何处发生？•在何时发生？•为什么会发生这些经验？•当这些经验发生时，他们会有哪些问题或想法？32经验设计的特色•网站或网页的经验设计有一项特色，就是使用者的一切活动，包含感观、动作、心灵都发生在虚拟的空间中。•在虚拟的空间中，建立经验最快的方法就是仿真实体的世界，因此如何整合实体与虚拟世界中的空间与活动，弥补虚拟世界相较实体世界的不足之处，并利用虚拟世界优于实体世界之处，则是经验设计时的最大挑战。33经验设计七大元素•品牌资产（brandasset）•信息架构（informationarchitecture）•视觉影像（visual）•文字风格（editorial）•听觉声音（sound）•动线规划（structural）•网页技术（technology）34品牌资产•企业识别(CI、VI)、企业文化、企业精神、广告行销等资产，是决定网页设计的基础，例如网页所采用的颜色、基调、技术、图片、图标、文字风格、信息内容等等，都应视企业的品牌为设计的依归。尤其拥有丰富品牌资产的企业，在塑造数字世界的品牌形象时，往往比实体世界更需要斟酌考虑。35信息架构•内容架构是最接近网站源头的元素，所谓源头是指网站规划阶段包含网站设立的目的与必须达成目标，网站的内容其实是根据这些条件而产生的，产生之后如何以最适合的方式分类、群组，深深地影响后来的浏览接口设计与视觉的呈现。因此每家公司都会有一套Approach，运用有系统性思考与检验方式来建立网站的骨架，之后的文字影像内容就像网站的皮肉一样，能以最美观的姿态出现在它们应该出现的地方，并且被使用者以最快速度找到。36视觉影象•图片、影像、图标、动画、底图背景、版面规划等是网页设计的灵魂，尤其在强调眼球数(Eyeballs)的网络媒体上，视觉的展现一直是企业、网络使用者与媒体评断网页设计优劣与否的第一道关卡。然而受到网络传输速度的限制，设计网页不像平面那样拥有要求超高解析品质的权利，但也能看出一个设计者的功力。视觉影像的元素通常被主观影响，在经验设计的精神里，一切都应该回归到使用者的立场，最大的判断依据是他们联机的速度与上网的目的。37文字风格•设计一篇网页或构思一则网络广告时，小从一个按钮的命名，大到一整篇公司简介，都必须靠专业的文案人员来处理，我们称之为WebWriter。虽然图片可以抓住网友