手机设计规范
『壹』 做手机界面设计的尺寸是多少
从设计方面来看,做手机界面设计的尺寸一般分为iPhone和Android两种设备。
如果以iPhone为设计设备,尺寸一般是使用750x1334,1125 x 2436,1242 x 2208这三种尺寸设计都可以,750x1334是2倍图设计,1125x2346和1242x2208都是3倍图来进行设计。
如果是用PS做设计稿就用750*1334,如果是用SKetch或者XD来设计,常见是用1倍尺寸来说,也就是375*667或者375*812(iPhone X)。
如果以Android为设备进行设计,尺寸一般使用720x1280,1080x1920进行设计第一种是2倍图,第二种是3倍图。
近年来iPhone和Android的设备增多,各尺寸也逐渐变多,下面有一份安卓屏幕尺寸表:
(1)手机设计规范扩展阅读:
1、UI界面设计的基本要素:
机界面层级:idle(待机界面) Mainmenu(主菜单) Submenu(二级菜单)Third level menu(三级菜单) 界面除了包括图标和文字外,比较重要的还有function animation(呼叫,发送信息等) 以及 function interface(计算器,日历界面等)
明确意义的图标,风格鲜明的版面设计是手机界面设计的重要工作,较为流行的是以Motorola,Nokia等为代表的欧洲简单风格,以及韩国的时尚绚丽的风格。
2、设计注意事项:
尺寸问题: 480X800,540X960,720X1280,1080X1920象素尺寸是较常见的手机屏幕尺寸,在设计时可以根据实际产品要求进行设计,更大的屏幕可以有更多的交互表现和视觉元素的支持,较为自由。
色彩问题: 由于手机lcd本身的限制,在色彩的还原程度上没有pc如此完善,因此在选用色彩时要根据使用的屏幕进行调节。
可实现性问题: 受到硬件运算速度和内存的影响,以及不可预计的后台程序开发难度,过于复杂的效果将很难进行实现,与程序工程师和ui工程师,硬件工程师的沟通显得尤为重要。
『贰』 手机软件用户界面UI设计规范是怎样的
用户界面设计的规范性显得尤为重要。 一些事一、界面效果的整体性、一致性yixieshi手机软件运行于手机操作系统的软件环境,界面的设计应该是基于这个应用平台的整体风格,这样有利于产品外观的整合。 yixieshi1、界面的色彩及风格与系统界面统一互联网的一些事软件界面的总体色彩应该接近和类似系统界面的总体色调,例如:系统色调以蓝色为主,我们的软件界面的默认色彩最好与之吻合,若使用与之大相径庭的色彩,比如大红、柠檬黄,色彩的强烈变化会影响用户的使用情绪,假想你买了一款从外观到系统界面都很满意的手机,操作的时候突然发现内置的应用软件和系统界面不统一,你会有何感想呢?第一感觉不好的东西我们的用户还会去用它吗?所以我们要知道手机的外观和系统界面已经是由手机制造商根据用户审美习惯定制的,它应该有他们的审美群体,我们要给这款手机做软件就应该有效地利用制造商基于此款手机的审美特征,以赢得喜爱此款手机的用户,使他们对系统界面的肯定和喜爱有效的转移到我们的产品上来。当然合理地结合系统界面进行设计还包括图标、按钮的风格及在不同操作状态下的视觉效果。互联网的一些事2、操作流程的系统化互联网的一些事手机用户的操作习惯是基于系统的,我们的界面设计在操作流程的安排上,也得遵循系统的规范性,让用户达到可以使用手机就会使用我们的手机软件,简化用户操作流程一些事二、界面效果的个性化一些事是不是我们追求整体性和一致性,就忽略软件界面的个性化呢?整体性和一致性是基于手机系统视觉效果的和谐统一而考虑,个性化是基于软件本身的特征和用途而考虑。因此这一点也是不容忽视的!一些事1、特有的界面构架yixieshi软件的实用性是软件应用的根本,我们设计应该结合软件的应用范畴,合理的安排版式,以求达到美观适用的目的,这一点不一定能与系统达到一致的标准,它应该具有它所具有的行业标准,例如:证券交易、地图操作等界面特征,需要分析软件应用的特征和流程制定相对规范性的界面构架。界面构架的功能操作区、内容显示区、导航控制区都应该统一规范,不同功能模块的相同操作区域的元素风格应该一致,让用户能够对不同的模块的操作迅速掌握。从而也使整个界面统一在一个特有的整体之中。 互联网的一些事2、专用的界面图标一些事软件的图标按钮是基于自身应用的命令集,它的每一个图形内容映射的是一个目标动作,因此作为体现目标动作的图标,它应该有强烈的表意性,制作过程中选择具有典型行业特征的图符,有助于用户的识别,方便操作。图标的图形制作不能太繁琐,要适应手机本身显示面积很小的屏幕,在制作上尽量使用像素图,确保图形质量清晰,如果针对立体化的界面,可考虑部分像素羽化的效果,以增强图标的层次感。互联网的一些事3、界面色彩的个性化设置互联网的一些事色彩影响一个人的情绪,不同的色彩会让人产生不同的心理效应,反之不同的心理状态所能接受的色彩也是不同的,不断变化的事物才能引起人的注意,界面设计的色彩个性化,目的就是用色彩的变换来协调用户的心理,让用户对软件产品时常保持一种新鲜度,它是通过用户根据自己的需要来改变默认的系统设置,选择一种自己满意的个性化设置,达到软件产品与用户之间的协调性。在众多的软件产品中都涉及到了界面的换肤技术,在手机的软件界面设计过程中,应用这一个性设置可以更大的提升软件的魅力,满足用户的多方面需要!在具体操作实现的过程中,色彩的搭配显得尤为重要,要考虑图标色彩与换肤色彩的色彩反差和效果的统一,以不至于造成花、乱的界面效果。一些事三、界面视觉元素的规范。互联网的一些事1、图形图像元素的质量一些事尽量使用较少的色深表现色彩丰富的图形图像,既确保数据量小又确保图形图像的效果完好,使图形图像在软件系统中所占数据量尽量减小,提高程序的工作效率。
『叁』 安卓UI界面设计规范标准
简单来说Mobile GUI设计就来是手持设备的自图形用户界面设计,狭义上来看是手机和PPC,广义上可以推广至手机,移动电视,车载系统,手持游戏机,MP3,GPS等一切手持移动设备。
Mobile GUI的设计基于对手持设备产品的使用特性的理解,对用户的研究和对界面使用情景的深入研究。GUI的设计分为平台内置和主题设计部分,前者需要专业的design house根据厂家的实际产品进行设计分析后进行整体设计,后者则可以经由任何用户进行自主设计,当然后者的设计限制和平台限制都比较大。
目前索爱和三星以及Nokia的S60平台支持用户的Theme自定义设计。
设计研究的流程为:产品特性--用户心理--市场背景--图形设计策略--设计检验--实际设计投放
『肆』 按app界面设计规范设计的页面做成手机网页浏览尺寸太大
那只能做自适应宽度的页面了
『伍』 手机版网页设计规范
手机版网页设计和PC端网页设计大同小异,只要注意手机端的整体排布尽量采用竖排,横排太多会压缩文字和图片空间,影响呈现效果,手机页面的尺寸一般宽度设置为640像素,高度不限,其他就没什么了!~
『陆』 安卓手机ui设计尺寸规范
众所周知,安卓系统是开源的,国内又有超多的手机厂商,小米、魅族、华为、oppo、三星等,每一个品牌有属于自己的UI设计规范,但是我们主要分析UI界面尺寸规范。
1、字体
安卓系统中文采用的是思源黑体,英文字体为robot字体。
只使用偶数单位 24 pt,28 pt,36 pt等字体大小
2、mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi、dp、px到底是什么意思?
讲图标之前先来分析一下一排英文的意思:
mdpi、hdpi、 xhdpi、xxhdpi、xxxhdpi都是表示的屏幕密度大小,依次数值越大,其分辨率越高。常用的是xxhdpi和xxxhdpi。
dp是安卓系统专用的长度单位,设备独立像素的意思。不同设备有不同的显示效果,这个和设备硬件有关。多为图标使用,文字则用sp(放大像素),主要用于字体显示best for textsize。
px是像素的意思, 不同设备显示效果相同。
从左到右依次是:① 应用栏高度:56dp;应用栏左右内边距为16dp;应用栏图标上下左内边距为16dp;应用栏标题左内边距为72dp;应用栏标题下边距:20dp;
②应用栏高度为128dp;
③操作栏高度为56dp;标题栏高度:80dp;标题栏底部内边距:8dp;描述区域高度:72dp;描述区底部内边距:16dp。
5、列表高度
垂直边框、水平外边距、边框左右外边距各16dp;带有图标或者头像的内容有72dp的左边距。
垂直边距
①状态栏:24dp;②工具栏:56dp;③子标题:48dp;④列表项:72dp
『柒』 手机端网页设计尺寸多少
要根据不同手机不同的屏幕分辨率来规定尺寸。
一般做效果图主流都是做480*800来测试,iphone4(或s)就用640*960,但这个都只是效果图,真正开发还需要切图用点9来做屏幕适配。
常见手机显示屏分辨率:96x65,96x96,128x96,128x128,160x128,160x160,176x144,220x176,240x176,320x240,640x480,800x480
苹果4:960×640 像素,3.5英寸
三星:480×800 分辨率
小米:480×854 4英寸TFT屏幕
android手机屏幕尺寸
1280×800 854×480 640×480 480×800 432×240 400×240 320×480 320×512 320×240
(7)手机设计规范扩展阅读:
手机ui设计是手机软件的人机交互、操作逻辑、界面美观的整体设计。置身于手机操作系统中人机交互的窗口,设计界面必须基于手机的物理特性和软件的应用特性进行合理的设计,界面设计师首先应对手机的系统性能有所了解。手机UI设计一直被业界称为产品的“脸面”,好的UI设计不仅是让软件变得有个性有品味,还要让软件的操作变得舒适、简单、自由,充分体现软件的定位和特点。
随着手机移动设备不断普及,对手机设备的软件需求越来越多,手机移动操作系统厂商正在不约而同地建立手机设备应用程序市场,如Apple的App Store、Google的Android Market、Microsoft的Windows Phone 7 Marketplace,给手机的终端用户带来巨量的应用软件。这些软件良莠不齐,界面各异,手机的终端用户在众多的应用使用中,最终会选择界面视觉效果良好,且具有良好体验的应用留在自己的手机上长期使用。
『捌』 iOS和安卓的设计规范有何不同
是一种基于Linux的自由及开放源代码的操作系统。主要使用于移动设备,如智能手机和平板电脑,由Google公司和开放手机联盟领导及开发。
iOS是苹果公司的移动操作系统。
iOS是由苹果公司开发的移动操作系统,苹果公司最早于2007年1月9日的Macworld大会上公布这个系统,最初是设计给iPhone使用的,后来陆续套用到iPod touch、iPad以及Apple TV等产品上。
iOS和安卓的ui区别二:UI设计规范不一样。
具体的UI设计规范详解请点击阅读:iOS、Android、WindowsPhone官方设计规范汇总
比如现在通常设计的尺寸对比如下:
iOS: 750*1334 或者 1242*2208
android 720*1280 或者 1080*1920
iOS和安卓的ui区别三:导航方式不一样
iOS的Tab放在页面底部,不能通过滑动来切换,只能点击。也有放在上面的,也不能滑动,但有些Tab本身可以滑动,比如天猫的。还有新闻类的应用。
Android一般放在页面顶端,可以通过滑动页面来切换Tab,当然Tab可以点击切换,Tab多的话,Tab本身也可以滑动。比如豌豆荚,网络贴吧,QQ。总之,Android啥都可以有。
iOS和安卓的UI区别四:单条item的操作
iOS单条item的操作有两种,点击和滑动,点击一般进入一个新的页面,滑动会出现对这条item的一些常用操作,如微信里滑动一条对话,会出现标记未读和删除。
Android中,单条item的操作也有两种,点击和长按,点击一般进入一个新的页面。长按进入一个编辑模式,可以在里面进行批量和其他一个操作,比如删除,顶置等等。比如小米的短信页面;长按也可以弹出情境操作栏dialog,进行操作,比如Android版的微信。
OS和安卓的UI区别五:实体键
iOS只有一个实体键(音量,电源不算哈),home键,这个键有这么几个功能:
1、按一次,回到桌面。
2 、双击,出现多任务界面
3、iOS8里面,轻触两下Home键,调出单手模式
4 、指纹解锁
Android有四个实体键(现在很多被屏幕上的虚拟键代替,但功效是一样的)4.4一下的分别是back键,home键,menu键,和搜索键。4.4及以上,是back键,home键,多任务键。安卓原生是这样,经过优化的Android就不一定了,比如魅族的smart bar,根据当前页面情景变化,不过蛮好用。
Android的back键,在大部分情况下,和页面上的返回功效一样。不过,Android的back键可以在应用件切换,还可以返回主屏幕。这个iOS里面的键不能在应用间直接切换。
iOS和安卓的UI区别六:浮窗设计元素不一样
安卓里可以看到各种浮窗,流量,清理内存等等。iOS暂时还不支持这样的浮窗。越狱的貌似可以。
iOS和安卓的UI区别七:图标尺寸和命名规范不一样
1、iOS和安卓手机的APP图标尺寸规范和图标命名规范
2、对比PC、iOS、Android等终端APP的交互设计的差异化
『玖』 如何评价新版 iPhone X 的设计规范
10 个设计师里 9 个强迫症,剩下那个去设计了 iPhone X……
发布会谢幕了,媒体们也发完了新闻稿,朋友圈也热闹过了,接下来的工作该轮到设计师了。iPhone X 11月才发货,但你也许已经接到做适配设计的任务了。在这之前,让我们先来看看这个 iPhone X,对 UI 设计师的日常工作有什么影响。
新增的虚拟 Home 指示条——你不得不考虑的设计元素之一
iPhone X 迈向了全面屏,移除了原本在手机底部的实体 Home 键,取而代之的是一条 134 x 5 pt 的虚拟 Home 指示条。「底端上划」成为了全局性的系统操作,它可以让你返回桌面(原本的单击 Home 键),或者切换应用程序(原本双击 Home 键)。我将这个虚拟 Home 指示条的特性总结为以下五点:
特性一:如影随形
苹果在最新的开发文档中指出,这个 Home 指示条是「至关重要的系统元素」,除了在某种特殊条件下,这个指示条将永远伴随着你的 App,成为强制的设计元素出现在屏幕中。这就意味着,在你的 App 设计中你将不得不为它保留位置,并考虑好周围元素与它的兼容关系。
特性二:黑白双煞
什么?你说你想做彩虹渐变指示条?少侠你太天真了……这个虚拟 Home 指示条只有亮/暗两种模式,它会自动根据周围背景,选择将自己变身成白色或是黑色,从而尽可能地和周围背景有所区分。