哈弗H8平板APP界面设计毕业设计说明书

毕业设计说明书题目：哈弗H8平板APP界面设计产品设计工艺设计方案设计√类型：学生姓名：学号：学院：艺术学院专业：电脑艺术设计（新媒体）班级：学校指导教师：企业指导教师：_____________________________2016年1月9日《哈弗H8》平板APP界面的设计制作摘要当今社会的生活节奏越来越快，平板设备不断普及，对平板设备的软件需求越来越多，从以前的追求技术到现在的追求视觉。界面视觉效果良好，且具有良好体验的应用留在自己的平板上长期使用。因此，平板UI界面设计在当今移动互联网迅猛发展的时代中显现得尤为重要。我的作品是哈弗H8平板APP界面设计。希望我们的项目可以使广大消费者快捷、方便、明了的看到这款车的信息，解决信息不全面，对车型的不了解，对款式的性能。比之前有的软件更加完善，更加细致全面。现如今车的品牌和种类都特别多，有的消费者并不是特别的了解，在购车前都会做好十足的准备，我们要做的这个APP就能使有想法买这款车的消费者非常的了解这款车，而且也能使消费者有个对比。此款平板APP界面设计主题突出，明确。整体色彩运用暖色调系列，界面风格整体统一，我们的APP栏目有：车型感官、内饰体验、经销商查询、性能装备表、养车小知识。是一款以实用和独特的风格呈现给消费者更快捷、方便、明了的体验。关键词：哈弗H8;UI界面设计;平板APP 目录1.摘要 11.目录 22.引言 32.1项目目的和内容 42.2项目分析 42.2.1行业背景分析 42.2.2同类型APP分析 42.3基本要素 42.3.1设计风格定义 42.3.2规格定义 42.APP开发可行性分析 52.1设计原理上的可行性分析 52.2开发技术上的可行性分析 53.界面详情设计 53.1市场调查 53.2承担项目 63.3应用界面设计 63.3.1按钮的设计 63.3.2文字的设计 63.3.3背景的设计 63.4色彩 74.设计中遇到的问题和解决方案 75.结论 8参考文献 8致谢 81引言当今社会的生活节奏越来越快，人们对平板的要求也越来越高。平板APP设计是平板软件的人机交互，操作逻辑，界面美观的整体设计。在漫长的软件发展中，界面设计工作一直没有受到设计师得关注，其实软件界面设计是产品的重要买点。一个操作简洁美观的界面会给人带来舒适的视觉享受，拉近人与平板的距离，为商家创造卖点，同时用户能够最直观的感受到视觉设计的魅力。我所选择的是哈弗这款车的品牌，哈弗是长城汽车定位为CUV车型(CityUtilityVehicle)，其中文意思是指城市多功能车。现在的人群使用汽车类型APP也是越来越多，但是属于一款车型的APP很少。哈弗H8是长城汽车将要推出的一款中型城市SUV车型。其前脸依然采用传统的镀铬大嘴设计风格，部造型更加饱满，攻击性更为强烈。外观更具肌肉感，车内空间更大。国产合资车相对于性价比更高。现如今车的品牌和种类都特别多，有的消费者并不是特别的了解，在购车前都会做好十足的准备，我们要做的这个APP就能使有想法买这款车的消费者非常的了解这款车，而且也能使消费者有个对比。1.1项目目的和内容我的作品是哈弗H8的车型平板APP界面设计，主要针对将要买车了解车型的群体，希望我们的项目可以使广大消费者快捷、方便、明了的看到这款车的信息，解决信息不全面，对车型的不了解，对款式的性能。比之前有的软件更加完善，更加细致全面。现如今车的品牌和种类都特别多，有的消费者并不是特别的了解，在购车前都会做好十足的准备，我们要做的这个APP就能使有想法买这款车的消费者非常的了解这款车，而且也能使消费者有个对比。此平板APP界面设计主题突出、明确，整体色彩运用运用为暖色调为主，风格统一，是用平面化的表现方式为学生们带来不一样的清新健康体验。我的作品具有高的体验效果，创意设计把消费者所需要的体现在每个界面，精确的分类、有创意的界面设计，并且每一个像素的细节呈现着令人赏心悦目的视觉效果。将以独特的风格，把APP应用更加符合消费者的需求，让消费者能够快捷、方便、明了的看到这款车的信息。作品内容包括有：启动界面（1张）、主界面（1张）、车型感官（11张）、内饰体验（12张）、经销商查询（6张）、性能装备表（14张）、养车小知识（1张）。1.2项目分析1.2.1行业背景分析随着计算机广泛运用，平板市场的快速发展，发现2014年12月中国平板网民规模达至5.57亿，使APP应用行业迅速发展。其中除了游戏和广告之外，其它类型的APP应用近期数量不断增加，而汽车类型的APP也越来越多，根据汽车品牌不同，风格类型也各有不同。汽车是人们出行的一种重要交通工具，给人们带来很大的便利。移动互联网时代，汽车APP也因人对汽车的多种需求而不断开发上线。随着汽车行业的发展，如今，越来越多的品牌选择用APP来讲述品牌故事。各大品牌也相继推出了属于自己的APP平台，这样的好处就是可以让消费者享受到随时随地的便捷服务。平板相对与手机来说更加清晰屏幕的尺寸更大对于我们做的汽车类型的APP更加便捷。而汽车作为人们出行的重要工具，当两者结合起来共同为用户服务时将是不错的体验。1.2.2同类型APP分析相比同类型APP，我的既有缺点也有他自身的优点之处。缺点是：内容不够丰富，在技术上有待提高。优点是：使用的风格大胆，符合我想要做的主题。更加体现了越野车的特性，让消费者更加了解，使购买欲望更强。在细节方面也处理的比较好。在动画的形式上也给人耳目一新的感觉。跟同类型APP相比增加了一个启动动画，让消费者觉得与别的APP别具一格，还新增加了一个养车小知识，给消费者温馨的感觉。在背景上大胆的运用风景的素材表现出越野的特性。虽然APP有美中不足，但和同类型相比，我的APP还是存在它本身的优势。1.3基本要素1.3.1设计风格定义手绘所有界面草稿，在Photoshop、CorelDRAWCs4中处理图片色界以及制作效果图，接着在Flash中制作动画效果。1.利用PS制作效果界面图，PS设计界面的排版、图标、配色、风格等，确定效果方案图。2.再用PS以及CoreIDRAW来做主界面、二级界面、三级界面。3.我们将用Flash来做引导页面的动画。4.用Flash制作动画，加入感染力的音乐。5.Flash制作多媒体的图形和界面。1.3.2规格定义（1）设计尺寸：宽度：1136像素高度：852像素（2）最佳显示分辨率：72dpi（3）色彩模式：RGB2APP开发可行性分析2.1.设计原理上的可行性分析整个汽车平板APP推广以展示图片、提供信息为主，采用静态页面的形式，然后利于FLASH制作动画效果形成APP软件。该款APP有美观的界面设计，软件的操作舒适、简单、自由,便捷的交互设置方便用户的使用。1.前期选择合适的项目，进行市场调查，资料的收集；需找相关海报的风格色彩搭配方式，借鉴别的优秀网站和手机app。2.方案草图，确定方案。确定栏目用PS做效果界面图。3.PS修改界面图，根据效果界面图的问题进行修改。最终定稿。4.确定效果界面图以及细节设计，进一步研究效果及细节和对方案的调整。5.最后用Flash制作动画，修改、调整达到方案的效果。2.2开发技术上的可行性分析技术介绍：1.利用PS制作效果界面图，PS设计界面的排版、图标、配色、风格等，确定效果方案图。2.再用PS以及CoreIDRAW来做主界面、二级界面、三级界面。3.我们将用Flash来做引导页面的动画。4.用Flash制作动画，加入感染力的音乐。5.Flash制作多媒体的图形和界面。3界面详情设计3.1市场调查通过我们小组的市场调查发现：平板APP软件要比其他渠道车辆信息要全面一些，信息的更新速度也要快很多，汽车的信息也更加的具有专业性，功能也更加的方便。而平板APP软件相比其他渠道来说是没有办法直接获取有效的信息，而平板APP的内容的可信度也不是很高，功能也单一。结合这些我们小组讨论要做一个功能丰富、内容可信度高的一款APP。就现在国内的外现况分析：单个汽车品牌的APP并不是很多，在这个方面哈弗有研发自己的APP。但并不是很好，在功能上面分析有灵感、外形、空间、性能以及360度展示，通过这几个可以初步的了解H8这一款车，但是没有深入的介绍这一款车的优缺点，没有让用户明简单直接的明白这一款车，只是用数据来说明这一款车的优点，而就给会用户一种不真实的感觉。3.2承担项目在本次毕业设计中，我是小组的组长。我所承担的项目是前期的调查、图文的收集和三级界面，在交互动画中的后期修改。我们的APP栏目有：车型感官、内饰体验、经销商查询、性能装备表、养车小知识。这些栏目都是通过小组讨论，再三选取的。在前期的调查当中我们选取的是哈弗H8这款品牌的车型的题材为主题。通过上网查询资料以及问卷调查来了解，在制作的过程中我们对于同类型的APP做了对比，收集了各种不同风格的海报来借鉴。通过上网搜查一些我们需要用到的图片然后进行选取，用于我们需要的栏目背景以及细节素材。我做的三级界面主要是车型感官里面的车身颜色的选择和外观局部的观赏，内饰体验点击进去细节图片、文字讲解以及经销商查询当鼠标在车子图标上显示的资料。在后期会把使用Photoshop做的效果图用Flash以动画的形式展示出来，在期间负责完善动画效果。3.3应用界面3.3.1按钮的设计按钮的字号要看按钮的大小来确定。字的高度为按钮高度的1/2—1/3为佳，同样，字的宽度为按钮宽度的1/2—1/3比较好看。按钮的颜色。按钮的颜色最好与整个界面的主色调统一。如要求突出按钮，那么按钮的颜色可以试试界面的对比色。3.3.2文字的设计文字是界面的主体，也是传达信息的主要工具。因此，文字绝对不可以马虎。文字的字体我选择为黑体，黑体显得独具一格，给人一种粗实有力、严肃庄严、朴素大方的感觉。3.3.3背景的设计背景是界面设计缺一不可的，也是最难挑选的地方。它实质上是对产品进行艺术包装。背景必须和软件主题有关联，要能衬托出主题又不显得很单一，因为这些背景就是对软件的高度抽象化，它要既能让人觉得赏心悦目，又能体现软件的宗旨。3.3色彩色彩是艺术表现的要素之一。在进行设计时，要根据和谐、均衡和重点突出的原则，将不同的色彩进行组合，搭配来构成美丽的页面。根据色彩对人们心理的影响，合理地加以运用。我们整个色系为暖色调。暖色调给人:日光不透明刺激浓厚固定近重干，人们见到暖色(如红、橙、黄等)一类色彩，会联系到阳光、火光、鲜血等景物，产生热烈、欢乐、温暖、开朗、活跃、恐怖等感情反应。在色彩上我们也会给予冷暖的对比来更加衬托主题，效果更强。4设计中遇到的困难和解决方案在设计创造过程中遇到困难时难免的，而设计的整个过程本身就带着种种困难，发现并解决困难是一个过程，人生亦是如此，跌宕起伏，不是完美也不尽人意。此次APP设计中，我遇到了不少难题，开始就是困难，在最初的选题上我们是几番波折，选题是一改再改，才最终确定了这一个选题。在制作过程中色彩以及风格的选择也一再改动。想要作品能过呈现主题相符合并且和谐的感觉还是很难的，而且必须保证在整体主题色调格局统一又不单调，就需要花费很多时间去思考。我坚信任何问题都有解决的方法，与组员进行交流共同探究，请教老师帮助解决，上网查阅相关资料，通过比较解决方案，最终完成整个设计。5结论通过这一段时间的努力，终于