常用的UI概念设计方法.ppt

如何进行有效的GUI设计 2014 11 7ByIvan UserExperienceDesign 它是用户体验的设计门类 用户研究 交互 视觉 的集合 用户体验要素模型 GUI 图形用户界面 设计在模型中的所处位置 视觉设计的基本流程 概念提取概念设计详细设计落地 和交互设计的关系 和用户研究的关系 品牌基因的关系 评价原则 常用的思维方法 元素提取 控件的系列化设计 典型界面的整体设计图标 语言 色彩 动画的统一 操作行为的统一 常用工具介绍 1 基本用户体验概念介绍2 企业中一般的用户体验流程是怎样的 3 常用的寻找概念的方法4 实例说明 偏GUI方面 5 一些评价原则 标准的探讨 偏GUI方面 1 基本用户体验概念介绍2 企业中一般的用户体验流程是怎样的 3 常用的寻找概念的方法4 实例说明 偏GUI方面 5 一些评价原则 标准的探讨 偏GUI方面 用户体验5层次要素模型 外在 表象 视觉刺激 文本 图标 界面 内在 灵魂 根源 交互 业务理解 用户理解 战略理解 用户体验5层次要素模型 表现层一系列的网页 界面 由图片组成框架层按钮 表格 照片和文本区域的位置结构层确定各种特性和功能的最合适的组合方式范围层功能和特性是否被纳入 即设计范围战略层经营者和用户分别想从网站得到什么 用户任务 输入数字输入文本输入公式格式细胞排序信息过滤信息聚合信息图数据保存数据导入数据出口数据打印 业务目标 取代竞争产品激励销售其他集成产品建立文件格式为默认信息共享格式 用户类型 会计商务策划师主妇 使用场景 办公桌面笔记本在飞机pda在汽车 例如 我们要设计一款 校园购物 的APP我们将如何进行 目标 业务目标 用户模型与用户目标 任务 用户任务和活动 场景 功能规格 工具 导航地图 概念地图 页面线框图 UI设计指导 GUI视觉风格指导 可用性测试 用户界面原型设计活动 低保真高保真 时间线 1 基本用户体验概念介绍2 企业中一般的用户体验流程是怎样的 3 常用的寻找概念的方法4 实例说明 偏GUI方面 5 一些评价原则 标准的探讨 偏GUI方面 详细设计 概念设计 Mockup 用户测试 用户测试 这个过程非瀑布式的按部就班 而是敏捷的反复迭代过程 开发 原型设计 1 基本用户体验概念介绍2 企业中一般的用户体验流程是怎样的 3 常用的寻找概念的方法4 实例说明 偏GUI方面 5 一些评价原则 标准的探讨 偏GUI方面 A 头脑风暴一种创造能力的集体训练法 准备 进行中 总结 方案筛选 1 准备 必须进行脑力激荡材料的准备 会场布置 避免打搅的事前安排等2 安排 除分组 限时外 还需有个主持人进行会议牵引和规则监督总结 对概念进行归类整理 并最终又专人进行概念陈述方案筛选 需要回答是否已经解决当前问题 并且是否新颖 1 禁止批评和评论 也不要自谦 对别人提出的任何想法都不能批判 不得阻拦 即使自己认为是幼稚的 错误的 甚至是荒诞离奇的设想 亦不得予以驳斥 同时也不允许自我批判 在心理上调动每一个与会者的积极性 彻底防止出现一些 扼杀性语句 和 自我扼杀语句 诸如 这根本行不通 你这想法太陈旧了 这是不可能的 这不符合某某定律 以及 我提一个不成熟的看法 我有一个不一定行得通的想法 等语句 禁止在会议上出现 只有这样 与会者才可能在充分放松的心境下 在别人设想的激励下 集中全部精力开拓自己的思路 2 目标集中 追求设想数量 越多越好 在智力激励法实施会上 只强制大家提设想 越多越好 会议以谋取设想的数量为目标 3 鼓励巧妙地利用和改善他人的设想 这是激励的关键所在 每个与会者都要从他人的设想中激励自己 从中得到启示 或补充他人的设想 或将他人的若干设想综合起来提出新的设想等 4 突出求异创新 这是智力激励法的宗旨 5 与会人员一律平等 各种设想全部记录下来 与会人员 不论是该方面的专家 员工 还是其他领域的学者 以及该领域的外行 一律平等 各种设想 不论大小 甚至是最荒诞的设想 记录人员也要求认真地将其完整地记录下来 6 提倡自由发言 畅所欲言 任意思考 会议提倡自由奔放 随便思考 任意想象 尽量发挥 主意越新 越怪越好 因为它能启发人推导出好的观念 7 强调小组整体利益 不强调个人的成绩 应以小组的整体利益为重 注意和理解别人的贡献 人人创造民主环境 不以多数人的意见阻碍个人新的观点的产生 激发个人追求更多更好的主意 8 综合改善原则 探索取长补短和改进办法 除提出自己的意见外 鼓励参加者对他人已经提出的设想进行补充 改进和综合 强调相互启发 相互补充和相互完善 这是智力激励法能否成功的标准 9 限时限人原则 专家小组规模以2 10人为宜 会议时间一般以20 60分钟效果最佳 为使与会者畅所欲言 互相启发和激励 达到较高效率 必须严格遵守下列原则 头脑风暴的原则 如何去找到爱订云的目标客群 头脑风暴进行中 由主持人公布会议主题并介绍与主题相关的参考情况 分组等 设想的分类与整理 设想的分类与整理实用型 幻想型 实用型 幻想型 设想的分类与整理 头脑风暴进行开发 通过进一步开发 就有可能将创意的萌芽转化为成熟的实用型设想 头脑风暴去进行论证 进行二次开发 进一步扩大设想的实现范围 质疑式头脑风暴 提出质疑 编制评论意见表 意见评估 对每一个设想提出质疑 XX设想是不可行的 因为 如要使其可行 必须 对每一个设想提出质疑 明确否定原因 改善建议 禁止对已有的设想提出肯定意见 而鼓励提出批评和新的可行设想 筛选出实际可行的方案 重点是研究有碍方案实施的所有限制因素 并发现新的解决途径 B 黑客马拉松Hackathon思维碰撞与接力 思维接 借 力 分组每队6个人轮流输出点子 且保证不重复 张XX 李XX 王XX 钱XX 孙XX 快速预定快速送达和附近商铺行成联盟情人节表白服务支持赊账 校园购物O2OAPP应具备哪些功能 如何识别并撬开大客户的门 高效卖出爱订云的产品 1 方法上 2 资源上 3 工具上 4 其它 C 思维导图适合一个人进行问题总结或者发散 东尼 博赞 1942年生于英国伦敦 英国大脑基金会总裁 世界著名心理学家 教育学家 他曾因帮助查尔斯王子提高记忆力而被誉为英国的 记忆力之父 他发明的 思维导图 这一简单易学的思维工具正被全世界2 5亿人使用 推荐工具 Xmind MindManager 整理思维碎片梳理关系脉络 结合线性和发散思维 帮助思考或者记忆 可作为学习工具 对学习过的知识进行整理 发现可能的解决方案 可作为思维工具 寻找合适的解决方案 D 随机词汇法适合思维完全进入死胡同状态启用 写下创意主题 寻找身边任何物品发散出名词 寻找合适的创意 1 发散出15个以上词汇2 每个词汇代表这个物体的特性3 名词不要太抽象 筛选出实际可行的方案 与主题关联产生联想 特性词汇 开一家主题餐厅 随机物体 创意构想 帆船模型 鱼 大海 漂浮 浪花 海盗 罗盘 木头做的 麻绳 鱼形装的各种装饰 如餐旗 窗帘挂饰 桌子上放个大鱼缸 养五颜六色的热带鱼 椅子设计成可以漂浮的 背景音乐里有海浪声 服务员穿海盗服 餐馆的VI要强调导航设计 菜单刻在木头上 餐具用木头的 和周围的时尚捆绑销售 如 送当季热门电影票 E 如何管理直觉和灵感学会记录自己的瞬间灵感 直觉应该是超越五感的 比如我们经常说的第六感1 是指对一个问题未经逐步分析 仅依据内因的感知迅速地对问题答案作出判断 猜想 设想 2 在对疑难百思不得其解之中 突然对问题有 灵感 和 顿悟 3 甚至对未来事物的结果有 预感 预言 等虽然不知道那是什么东西 但所有的直觉都有一种不知道从何而来的凭空出现的特质 突然而降 出乎意料 心生一念 非常深邃之类的 他们的注意力往往是悬空的 没有固定的依附对象 经常处于发呆状态 脑子空的 等待素材的碎片自动出现 然后抓住碎片开始咀嚼 学会随时记录自己的瞬间灵感 1 基本用户体验概念介绍2 企业中一般的用户体验流程是怎样的 3 常用的寻找概念的方法4 实例说明 偏GUI方面 5 一些评价原则 标准的探讨 偏GUI方面 任何与视觉相关的设计首先要把抽象概念 翻译成形容词汇再由形容词汇转换成可见的图形 概念 形容词 可见图形 项目目标 SetupaProjectGoalasanelementforthepurposeandtherangeoftheproject WestrategicallyapproachandcreatenewOutdoorGUIconceptWithOutdoorkeyfactor TocreateasetofmobilephoneThemeGUI whichmatchtheSmartPhoneandenhancethebrandimage 要创建一套与智能手机相匹配的主题界面 以提升品牌形象 Makeanewdesigndirectionoutof3setsdesign 在三套方案中选出一个方向 CooperationwithDiscovery与Discovery合作 DesignDirection Instrument SportyOutdoor设计方向 工具 运动户外 Analyzetargetuser srequirement分析目标用户的需求 Understandtrendandlifestyle了解趋势和生活方式 Analyzetargetmarketinformationtofindnewmarketopportunity分析目标市场信息 寻找新的市场机会 合乎情理的GUI设计以匹配户外活动人群 研究方向 ItillustratesmainissueofNewDesigndirection 市场 Theclassoftwentiestofortiesaremostactiveconsumersamongalltheoutdooractivities Maleandfemaleoutdooractivitiesarealmostthesameasitgoesdowntothelowagedclass Femaleconsumershavebeenincreasing Themainclassofconsumeristwentiestoforties Weanalyzephenomenonpresentedintheoutdoormarket ThefollowingistheelementsthatwecomposedbyanalyzingbehavioralpatternsInordertofigureouthowtheybehavewithusers purposesandneeds WederivecharacterbyanalyzingActivitiesandbehavioralpatternsofOutdoorTrend 用户行为 改善用户体验的因素 efficienttouse efficienttouse safetouse havegoodutility easytolearn easytoRememberhowtouse 兴趣 激励 有帮助 美观 创意支持 娱乐 过瘾 奖励 满意 情感照顾 趋势 Thisistheissueweneedtopaycloseattentiontoatoutdoortrend Increaseininterestinleisureaccordingtotheincreaseinthelevelofincome 1 point EconomicGrowth TheQualityofLife Wealth VariousThingstoEnjoy LeisureCultureWiththeintroductionofamarketeconomy theleveloflifehasincreasedandtheinterestinleisurehasbeenincreasing Moreover demandinleisurehasbeensteadilyincreasingafterBeijingOlympicGamesin2008 Awayfromsimplematerialisticconsumptionpattern asthedemandshiftedtomorediverseanduniqueexperiences outdoorexpenditurehasincreased Dreamaneco friendlylifethatisslowandfree 2 point Eco FreeofMind FreeofTime Eco Friendly SlownessPeoplewhoareexhaustedbymaterialcivilizationandexcessivespeedcompetitiontrytofindsimpleandeco friendlylife Whilebeingwaryaboutbeingaccustomedtorapidculture theywouldliketoenjoytheprocessofSlowfood SlowCity SlowLifebytakingtime Activity1 Routine Self ExpressionAtypethatenjoyoutdooractivitiesasameantoexpressone slifestyleandIndividuality 用户设定 Wearegoingtoexaminewhattheywantintheparticularlevelofactivitythroughuserscenario keyword Partoffashion Representtheeconomiclevel Expressindividuality RepresentLiberalLifestyle PartofCulturalActivities SophisticatedTasteandPreference Closetotheoutdooractivityoutofthecity AppealMyPreferenceIboughtSUVforleisuresothatIcanloadequipmentstoenjoysports Ihaveintentiontoshowoffthefactthatthisisnotapopularsportthatanyonecando butprofessionalactivitythatonlysomeonewhoareaddictedcanenjoy Thisisawaytorepresenttheleveloflifethatisdistinguishedfromothers BuyaSensibleLifestyleIcanexpressmyselfwithcharacteristicleisure Becausetherearelotsofwaystospendtime Ithinkthatitisprogressivetogooutsideandperformproactiveactivities Iwouldliketobeshowntobeanactivepersonwithsophisticatedtaste Activity2 DuringLightActivity Self satisfaction orientedAtypeofapersonwhogoesoutsidethecityandspendsomequitetimeinteractingwithnatureoutside Wearegoingtoexaminewhattheywantintheparticularlevelofactivitythroughuserscenario ExpandtheradiusofactivitiesfrominsidetooutsideWegooutsidetoseekuniqueexperienceespeciallythesedayswhenwefeelboredwithrepetitivedailyroutine Weseekdistinguishedexperiencethatwillneverbeattainedinsidewhileenjoyinghobbiessuchasle ports dance andhealth FindgenuinepleasureoflifefromoutdoorlifeBodymovementallowspeopletofindlifevalueswithdifferentform Peoplecanspendtimewiththeirfamilyandpeoplenexttoeachotherwhiledevelopingintimacyandenjoyingsocialactivities PursueNaturalExperiencePeoplewantofindpsychologicalhappinessfreefromextremespeedinessandpressureinourmodernages Peopleconsidernature experiencesimportanttolookforthegreenforestsofafamousmountainandlightlyclimbupthemountainforpeaceofmind keyword FunLeisure Smallpleasure Relaxation naturalactivity adesireforthebodymovement socialinteraction casualactivity interactionwithnature activitythathelpsthinkingandspeculation leisurearoundroutine Let senjoyourlifebecauseweworkedhard Wewouldliketomakeourfreetimemeaningfulforthebalanceofourwork health andrelaxation Inthemidstofthebusylife peoplegotosuburbsandtakepleasureofoutdoorsports Sometimestheytravelnearby ItbecomeschancetolookbackmyselfTheyenjoyspeculationwhiletakingalightwalkatsomewhereelsethanroutineplace suchasparknearby notanoffice Atthistime it snotforfunorentertainment butformoreliberalandmentalrelaxation 用户设定 Activity3 Duringviolentactivity AchievementorientedWithactivebodymovement Atypeofactivepersonwhofindsbalanceinhishealthylife Wearegoingtoexaminewhattheywantintheparticularlevelofactivitythroughuserscenario ImprovethelifequalitybystayinghealthyThelifewithWell beingandwellnesscomesfrommyhealth Wewalkorrideabiketogotoworkonpurposeasaninvestmentforhealth ThetransformationinconceptonActivityPerformaleisureactivitywithspecificpurposeratherthanjustbeingcomfortableandrelaxed Itisbecausepeoplewanttoenjoytheaccomplishmentthattheyfeelfromovercomingtheirphysicallimitationaswellassatisfactionfromtheirwork keyword Interactionwithnatureandpeople leaderofalife ensuringpassion newadventure deviationfromdailyroutine expertise healthyimage functionalassistance safety checkingactivities proactiveattitudetowardshealthylife Usingitemsthatmakepeoplefeelcomfortableduringviolentactivities livelymood pleasurefromtakingrisks CombinationofPhysicalandMentalHealthApersonbeganexercisingforhishealth Hehadtheirfrequentlateworksandirregulareatinghabitsandrhythms Ashemoveshisbody itleadshitohavearegulareatinghabitandhegraduallydevelopedsoundbodyandmind Blowthestressfromtheiractivemovement He dliketoexpresshispassionoutside Heislookingforlittlemoreviolentleisurebecauseheenjoyscompetitionwithhimselfandothers 用户设定 Exciting ColorfulHigh end SimpleModern EcoBasic minimalismWild Extreme Wit CreatvieExtremetechnologyBasicModernHigh end MinimalismPre natureColorfulWellnessCozy UsefulSpritWileSimpleElectronicValuable Wedevelopkeyexpressionwordstomainvisualdirection Specialized专业 Naturalism自然主义 一致性 基调 风格 视觉关键词 WittyColorfulFashionableYoung SophisticatedExclusiveFuture OrientedIntheedgeMasculineDetailedChic SoftVacationNature FriendlyRoutineWarmNaturalWell Being 概念案例描述 ExtractcomponentsofConceptDesign professional impressive meaningful eco everyday Liveliness Concept Lively活泼 设计元素 A Lively 活泼的 Thelookwithlivelycolorandwittyelementsexpressesyounganddynamicbyusingvariousshapesandpattern Pattern VividColor Scribble Effect Shape Material Color B Specialized 专业的 WeexpressluxuriousfeelingbyaddingspecificelementsonasophisticatedandfutureorientedshapeEmphasizemorechicandmasculinefeelingbyusingstrongpointcoloronacolorlessbackground Edge Wild profession firm Effect Shape Material Color 设计元素 C Naturalism 自然主义 Thedesignemotionallyapproachedtotheexhaustedmodernpeoplebyaddingcomfortableandwarmambiancefromnatureandmodernframeofcontemporary Soft Friendly Well being Effect Shape Material Color 设计元素 1 基本用户体验概念介绍2 企业中一般的用户体验流程是怎样的 3 实例说明 偏GUI方面 4 一些评价原则 标准的探讨 偏GUI方面 当茫茫的一片作品墙出现在我们眼前 我们是否能挑出最好的作品 一件好的GUI作品应具有怎样的优秀特征 在公众投票 专家评审中过滤出来的作品中 能否找到一些评价标准和规律 评价好作品的规律 来看看专业人士是怎样评价这些获奖作品的 当我们单一的看单纯的GUI作品时 我们更像是在欣赏一件纯粹的艺术作品 它符合基本的美的规律 一 一致性 各构成要素保持高度的一致性 色彩单一 给人以秩序感 画面 阅兵仪仗队等二 对称与均衡对称 以一条线为中轴 左右 或上下 两侧均等 画面 故宫全景 艾菲尔铁塔 凯旋门等审美特征 庄重 稳定 可靠 但静止 生硬 单调 呆板 均衡 组成整体的两个部分在形体 色彩 质地诸方面大致相等 画面 盆景五针松审