蘑菇街项目电商类手机App设计课件.ppt

上传人(卖家):三亚风情 文档编号:3562126 上传时间:2022-09-18 格式:PPT 页数:37 大小:8.56MB
下载 相关 举报
蘑菇街项目电商类手机App设计课件.ppt_第1页
第1页 / 共37页
蘑菇街项目电商类手机App设计课件.ppt_第2页
第2页 / 共37页
蘑菇街项目电商类手机App设计课件.ppt_第3页
第3页 / 共37页
蘑菇街项目电商类手机App设计课件.ppt_第4页
第4页 / 共37页
蘑菇街项目电商类手机App设计课件.ppt_第5页
第5页 / 共37页
点击查看更多>>
资源描述

1、1手机App设计-写在设计之前2项目班课程设计特点n 真实企业案例l最新企业资料l最新行业资讯l最新流行风格l最新设计技巧n 不只是ps操作n 课下辅导、相互交流切磋3手机App设计-写在设计之前n 实际企业中APP设计的基本流程n 实际项目中,UI设计师需要前期确定.n 设计中的工作技巧4手机App设计-写在设计之前n 实际企业中APP设计的基本流程测试环境测试上线后测试提出项目需求.txt.word整合,列出组织架构,组织相关人员.word .txt .jpg .ppt .mmap .html根据需求进行相关设计.jpg .psd .png编写程序调用数据库 市场部 产品部 设计部 程序

2、测试5实际项目中,UI设计师需要前期确定.n 项目人员相关l上下级需要协调的部门l实际的项目负责人及各个时间点p甲方?最好确定唯一一个负责人沟通方式及时间p领导?市场部领导产品人员+产品部领导设计部领导程序猿 生死做不了的程序,最后一般就只能改设计需求测试部大boss 保留中间不说话,最后完全推翻整个产品的权利6实际项目中,UI设计师需要前期确定.n 确立需要提交的文件和规格l是否需要原型图?p手绘p软件 跳转p相关设计文档l是否需要低保真、高保真?7实际项目中,UI设计师需要前期确定.l新建多大尺寸画布和分辨率?p使用何种系统版本为基础p针对哪些终端p是否适配横屏、竖屏p是否要印刷分辨率30

3、0dpi矢量格式8实际项目中,UI设计师需要前期确定.l是否需要切图和标注,如果需要,标准是.l是否需要设计相关占位图片pbannerp头像p占位图片p相关内容图片9设计中的工作技巧n 因为要应对工作中的l随时更改l推翻了重做l临时变节,总觉得上一版才是最好的l随意插活儿10设计中的工作技巧n 因为要应对工作中的l随时更改l推翻了重做l临时变节,总觉得上一版才是最好的l随意插活儿n 所以要询问关键人物:哪个优先级更高!n 所以要时刻存盘,每个版本都要备份!11蘑菇街项目电商类手机App设计12本章学习内容n 电商类App设计理论讲解n 项目需求概述n 项目设计规划与实现思路n Android系

4、统手机App常见规范及标准n 图标设计的原则及方法n 点9切图的制作方法n 启动页与引导页的技巧及方法13本章任务n 蘑菇街电商类手机App设计14本节目标n Android系统手机设计规范n 了解项目需求15Android系统手机设计规范16Android系统手机设计规范lAndroid的生产厂家繁多,界面尺寸大小不一,该如何下手呢?l在设计的时候是不是每个尺寸都要做一套?l要新建多大的画布?l文字该选用什么字体?字号多大合适?lAndroid在适配和切图方面该如何考虑呢?lpx dpi ppi sp?17Android系统手机设计规范n 界面尺寸与分辨率n 按钮与可点击区域n 字体与字号n

5、 图标的尺寸18界面尺寸和分辨率n px:Pixels 即像素n dpi:意思是每个英寸上,所能印刷的网点数n ppi:每英寸所拥有的像素数,即像素密度lPPI=(长度像素数+宽度像素数)/屏幕对角线英寸数n sp:安卓的字体单位l以160ppi 屏幕为标准,当字体大小为100%时,1sp=1pxlsp 与px 的换算公式:sp*ppi/160=px19界面尺寸和分辨率n 安卓手机千千万,屏幕密度如何辨20界面尺寸和分辨率21界面尺寸和分辨率n 就目前市场状况而言lldpi、mdpi 如今已绝迹,市场份额不足5%,新手机不会有这种倍率不用考虑lhdpi 480 x800市场份额不到20%lxh

6、dpi 720 x1280市场比例最大xxhdpi 1080 x1920数量逐渐扩大lxxxhdpi 1440 x2560极少数2K屏手机l科技发达,屏幕会越来越大l尺寸到达极限后,会有所收敛22界面的尺寸和分辨率n 在实际工作中l推荐使用XHdpi或XXHdpi的尺寸进行设计l即画布新建为720*1280px 或 1080*1920pxl或者根据测试机尺寸进行设计l分辨率为72px23界面的尺寸和分辨率l 选用720*1280px尺寸24界面的尺寸和分辨率设备屏幕大小(像素)状态栏高度(像素)导航栏高度(像素)标签栏高度(像素)XHdpi720 x1280509696XXHpid1080 x

7、192075144144n Android控件高度都支持自定义所以没有严格的尺寸数值25界面的尺寸和分辨率l对于初学者可以借鉴Android系统已经上线的App:导入一张完整的Android手机界面作为设计底板l原生Android App界面l按照自己的手机/测试机尺寸来制作,方便观看预览效果26按钮与可点击区域n 为考虑适配,所有按钮和可点击区域的尺寸,必须是4的倍数!n 一般把48dp作为可触摸的ui元素的标准l换算到XHdpi中,48dp=96pxl换算到XXHdpi中,48dp=144px27按钮与可点击区域28字体与字号n 默认英文字体:Roboton 默认中文字体:Droid sa

8、ns fallback 是谷歌自己的字体,与微软雅黑很像笔画无衬线末端和转折为直角笔画无粗细或粗细变化很小29字体与字号n 支持内嵌字体l考虑字体文件的大小l一般而言:中文字体比较大英文字体相对比较小n 字号最好为4的倍数n 保证识别度为第一任务l用颜色来区分重点l用大小来区分重点30字体与字号n 一般而言,以720 x1280px的界面中:用途sppx极小的、注释性文字1224小文本、辅助性文字1428正常文本16、18、2032、36、40标题文字、大文本2244lsp:安卓的字体单位lpx:像素31蘑菇街项目需求32蘑菇街-电商类手机App设计需求概述n 项目名称l蘑菇街-电商类手机Ap

9、p设计n 项目需求l为蘑菇街定制Android系统专用的手机App33蘑菇街-电商类手机App设计需求概述n 项目设计要求l安卓系统l手机端l电商类Appl蘑菇街网页端的延伸产品l需要上安卓市场等平台p需要绘制启动页面和引导页面p需要进行点9切图34上机练习n 如何保证所有/大部分控件和元素,都是四的倍数?l4x4图案的制作l网格和辅助线n Andorid系统手机界面模板制作设备屏幕大小状态栏高度导航栏高度标签栏高度XHdpi720 x1280509696XXHpid1080 x19207514414435重点总结n 设计工作中前期需要确立的事情n 设计工作中需要的注意事项n Android系统手机设计规范n 4x4网格系统36作业n Andorid系统手机界面模板制作n 了解自己手机中的电商类App,截屏备份到电脑中n 分析它们的目标人群和视觉风格特点n 检查以上的界面,所有控件和元素是否是4的倍数?n 检查自己之前做的Android界面所有控件和元素是否是4的倍数?

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > 办公、行业 > 各类PPT课件(模板)
版权提示 | 免责声明

1,本文(蘑菇街项目电商类手机App设计课件.ppt)为本站会员(三亚风情)主动上传,163文库仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。
2,用户下载本文档,所消耗的文币(积分)将全额增加到上传者的账号。
3, 若此文所含内容侵犯了您的版权或隐私,请立即通知163文库(发送邮件至3464097650@qq.com或直接QQ联系客服),我们立即给予删除!


侵权处理QQ:3464097650--上传资料QQ:3464097650

【声明】本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是网络空间服务平台,本站所有原创文档下载所得归上传人所有,如您发现上传作品侵犯了您的版权,请立刻联系我们并提供证据,我们将在3个工作日内予以改正。


163文库-Www.163Wenku.Com |网站地图|