手机客户端产品设计原则

屏幕手机屏幕尺寸分为物理尺寸和显示分辨率?物理尺寸是按英寸对角线计算。?显示分辨率指的是屏幕图像的精密度，是指屏幕所能显示的像素的多少?显示精度是每英寸上可以显示像素（DPI）。NOKIAN78的物理尺寸为2.4英寸，显示分辨率为240*320像素；HTCT7278的物理尺寸为2.8英寸，显示分辨率为480*640像素。两款手机显示精度不同，同样100*100像素大小的图片在这两款手机上看到的效果也不同， 同样大小的图片在HTCT7278看起来要比NOKIAN78小的多。HTC 英寸HTC 英寸分辨率种类（不完全统计）：128*128 128*160130*130 176*144 176*220208*208208*320 240*160240*240240*260240*320240*400240*432240*480320*240320*320320*400320*480345*800352*416360*480360*640400*800480*320480*360480*640480*800480*854480*864640*480 800*480一款软件适配所有分辨率的手机难度较大，势必需要先挑选主流分辨率进行设计，在此基础上适配其他分辨率的手机。鉴于2010年QVGA（240*320屏幕的市场占有率将达到70%可将QVGA勺手机当成主要的设计对象。视觉重点自上而下大多数情况下浏览者看电脑屏幕时都不由自主的以 “F”形状的模式阅读网页、而手机屏幕很小，显示能力有限，屏幕上内容尽收眼底，阅读文字时自上而下，因而信息的重要性也是从上到下依次排列。

F”形状的模式阅读简洁手机屏幕的显示能力有限，使用物理按键时，无法向电脑或者触摸屏那些跳跃式操作，必须依次切换控件的焦点，例如手机界面中的翻页程序，用户使用最多的就是“下一页”，将“下一页”放置为第一个控件便于用户操作，方案1优于方案2。方聚力37^1［匕款］方聚力37^1［匕款］［M0MI上一真HI下一7〕隐回反其搐题日团团回国回口国J斤N)薨1煤I目同回回回回回国界面简洁的途径:?减少控件的数目，使程序的主功能显然易见，引导用户操作。?当内容过多时，要突出重要信息，便于用户快速浏览。?显示出错信息时，不要只告知用户程序出现错误，要提供有用的信息引导用户完成操作。?手机上网的速度慢，一般在6k/s_,这就要求页面的内容尽量精简，避免过多的图片。?页面的内容控制在两屏以内，也不能空白。比如当用户支付电影票之后,不能只显示“支付成功”，可以引导用户使用其他功能。简洁要求文字描述简练，但也要充分利用手机屏幕上仅有的显示空间。例如iPhone的搜索栏，搜索框用于内容搜索，点击之后会显示虚拟键盘，除了左边默认的搜索图标之外，搜索栏还包含其他元素。?占位符文本。可以提醒用户搜索栏的功能（例如“Search"）或者搜索的内容（如Google或YouTube。?书签按钮。记住用户的搜索内容，如在地图搜索中，书签按钮可以快速地查到已标记位置、最新搜索的内容和联系人。默认在搜索栏上用户没有输入文本或者占位符文本时，书签按钮才可能显示。?消除按钮。可以快速地删除搜索栏中内容，默认在用户在搜索栏中输入文本时，才会显示清除按钮。任务当完成一个任务需要多步操作时，可将任务进行拆分成多个子任务，每个界面完成一个子任务。如逻辑清晰并保证用户操作的流畅性，可适当地增加页面跳转次数和点击的次数。如使用e指通客户端购买电影票的任务有:查询电影一选择放映场次一选座一确定订单一支付

堪Ui北中nr壬府畀大*-第*更广场诋6厘.CMO-ES匹19昵第r即堪Ui北中nr壬府畀大*-第*更广场诋6厘.CMO-ES匹19昵第r即1DOQM行*五域1书*Frtf码蛀下*103,1M^加/211,42LM3.8MW土自汗革HEMM用片“G:舟品李看守三）用信工・而r怎话• 讹.■*阪Isffilth30j&后映树阍il£iJQU51 --茎肯中心■里一建毡土:寸聿金筮日空以三丑七「庚行三S手看七摄球万军机支对am；l”l）：④普■手机♦存如九.导擎 通咨为甫至工满a■[1至；mUel：工□□□□□□□口

西.(JMWE口□□□□□□□

* 口口口口口口口口一3口□□□□□□□□□□□□Mnooq□□□□□□□BiSSftjEg姓也*W星e指通关注首要任务也是用户对于程序满意度的重要因素。所以在设计时，要保证界面上的每一个元素的设计都取决于当前首要任务，用户完成任务是否需要这些元素。举个具体的例子：这些信息或者功能对于用户购物是否有帮助呢？如果不是，这些信息或者功能是否在另外的使用情境中至关重要吗？避免输入使用标准iso手机按键时，用户平均每分钟输入英文21个单词，在手机上输入将减慢用户操作的速度，过多的文本输入是在浪费用户的时间和精力，如非要输入，需保证“物有所值”，用户会感觉到并没有因为输入而耽误了任务完成。以下途径可以避免输入：?使用列表选项的形式。?增加控件的可记忆性。

致性手机界面上出现的颜色、字体、文字和图片等元素要保持一致，一致性可以使用户知道在哪些地方找到特定的功能或信息，同时还能使得他们知道这些功能的正确使用方法。例如，返回上一级可以表述成：返回，上一级，后退，撤退……对于用户而言，这些文字没有明显的区别，但在手机界面显示时要只使用一种和同一个位置，如iPhone界面中的“返回”只显示在导航栏的左边。熊猫看书使用情境手机QQ手机属于移动设备，可以在各种场合使用，如地铁、路边、超市、飞机上等，手机可以切换到飞机模式。手机可以在各个时间段使用，手机 QQfi可以切换使用模式：标准模式、室外模式和夜间模式。操作方式手机操作有物理按键和触摸等多种操作方式，当同样的程序要在多种操作方式下使用，需顾及手指点击时可点区域的大小。使用物理按键时，按钮可以只是两个字，选中控件即可操作，而iPhone的可点击区域最好不低于44X44像素。反馈程序需给予合理的反馈，让知道用户程序当前的状态。.,..1Canirr亍乎4:30PMRIrbox 。DraftsSent胃Trash比如iPhone的运行指示，运行指示表示后台有程序正在运行，但任务完成时不会提醒用户。当程序无法立即完成联网时，状态栏上会显示运行指示。当程序执行的任务无法立即完成时，工具栏上会显示稍大点的运行指示。运行指示提供了很好的反馈机制，明确地告知用户程序正在运行比告诉用户任务已经完成更为重要。

AndroidvsiPhoneicon设计指南AndroidvsiPhoneicon设计指南Android在研究Android的icon设计之前，有必要先了解Android的界面是如何适配多样化屏幕的。适配性上一篇博文中提到，由于同一个UI元素（如100x100像素的图片）在高精度的屏幕上要比低精度的屏幕上看起来要小，为了让这两个屏幕上的图片看起来效果差不多，可以采用以下两种方法：?程序将图片进行缩放，但是效果较差。?为这两个精度屏幕的手机各提供一个图片。但是屏幕的参数多样化，为每一个精度的屏幕都设计一套 icon,工作量大并且不能满足程序的兼容性要求，势必要对屏幕的分级，如在160dpi和180dpi的手机屏幕上采用同一套icon,当这套icon在240dpi效果满足不了设计要求，就需要另做一套稍大些的icono在Android1.5以及更早的版本中，只支持3.2〃屏幕上的HVGA（320X480）分辨率，开发人员也不需要考虑界面的适配性问题。从Android1.6之后，平台支持多种尺寸和分辨率的设备，这也就意味着开发人员在设计时要考虑到屏幕的多样性。为了简化设计并且兼容更多的手机屏幕，平台依照尺寸和分辨率对屏幕进行了区分：?三种尺寸：大，中，小。?三种精度：高（hdpi）,中（mdpi）和低（ldpi）。程序可以为这三种尺寸的屏幕提供默认资源，如有需要，还可以为各种精度的屏幕提供资源。在运行时，系统会根据屏幕布局加载正确尺寸或者精度的图片。IconTypeStandardAssetSiz.es(inPixels),forGener^ltzedScreenDensitiesLowdensityscreenfldpt]Mediumdensityscreen佃叩」Highdensityscreen♦:酗ILauncher35x36w72x72pxMenu36x36|>x72x72pxStatusBar24X241Ml32x32p)C48k40pxTab24X24的32132px43k4SpMDislog24x24px32k32px43k48pxListView24x24px12K32Pl48x4SpxAndroid的icon尺寸在运行时，程序为最佳显示效果提供了三种方法：.图片缩放基于当前屏幕的精度，平台自动加载任何未经缩放的限定尺寸和精度的图片。 如果图片不匹配，平台会加载默认资源并且在放大或者缩小之后可以满足当前界面的显示要求。例如，当前为高精度屏幕，平台会加载高精度资源（如图片），如果没有，平台会将中精度资源缩放至高精度。.自动定义像素尺寸和位置如果程序不支持多种精度屏幕,平台会自动定义像素绝对位置和尺寸值等,这样就能保证元素能和精度160的屏幕上一样能显示出同样尺寸的效果。例如，要让WVG高精度屏幕和传统的HVGA屏幕一样显示同样尺寸的图片，当程序不支持时，系统会对程序慌称屏幕分辨率为320X533,在（10,10）到（100,100）的区域内绘制图形完成之后，系统会将图形放大到（15,15）到（150,150）的屏幕显示区域。.兼容更大尺寸的屏幕当前屏幕超过程序所支持屏幕的上限时，定义supports-screens元素，这样超出显示的基准线时，平台在此显示黑色的背景图。例如，WVGA中精度屏幕上，如程序不支持这样的大屏幕，系统会谎称是一个320X480的，多余的显示区域会被填充成黑色。但为了达到最佳的显示效果，最好的方法还是设计多套图片。那就有必要对于所有的屏幕依据精度值进行分级（高中低），之后再设计三套 icon:?先为主流的中精度屏幕（HVGA）设计一套icon,确定图片的像素尺寸。? 为高精度屏幕将图片放大到 150%,为低精度屏幕将图片缩小至 75%。? 将这三套资源放置到程序的三个文件夹下 ：res/drawable-mdpi/、res/drawable-hdpi/、res/drawable-ldpi/。程序在运行时，平台会根据屏幕的精度调取合适的icon。设计指南Android标准iconLauncherIcon是程序主界面上的功能图标， Android对于各个icon的风格有一定的要求：?符合当下的流行趋势，避免过度使用隐喻。?高度简化和夸张，小尺寸图标也能易于识别，不宜太复杂。?尝试抓住程序的主要特征，比如音像作为音乐的 icon。?使用自然的轮廓和形状，看起来几何化和有机化，不失真实感。?Icon采用前视角，几乎没有透视，光源在顶部。?不光滑但富有质感。正确和错误的icon另外，所有的icon都有文字标签，不要在设计时把文字也放到 icon中。LauncherIcon通常是一个较大的标准图标中包含一个小图标，使用一个中性色彩和一个主要色彩，并保持高度的对比，不宜过度饱和。#000000 #404040 #003399#FF6600 #FF660Q#CCOOOO#000000 #404040 #003399#FF6600 #FF660Q#CCOOOO推荐色值尺寸和定位Launchericons要有多样化的形状和样式，但又要形成统一的视觉风格，其尺寸和定位也用统一：(FullAsset)红色边框为图标尺寸

? (Icon)蓝色边框是图形尺寸，比图标尺寸稍小，图形之外的空间用于显示阴影和特殊效果。? (SquareIcon)橙色边框是另外一种图形尺寸。两种类型的图形尺寸可以达到统一的视觉权重。Icondimensionsforhigh-density(hdpi)screens:FullAsset:72x72pxIcon:60x60pxSquareIcon:56x56pxIconDimensionsformedium-density(mdpi)screens:IconDimensionsformedium-density(mdpi)screens:FullAsset:48x48pxIcon:40x40pxSquareIcon:38x3IconDimensionsforlow-density(ldpi)screens:?FullAsset:36x36px?Icon:30x30px?SquareIcon:28x28px模板下载Android的标准图标模板、在此基础上绘制icon,后期还要加上阴影效果WVGA席精度）屏幕的阴影:LayerStyle阻当blindi"?Qstdp.L：eFwuI：*OrapShadowLayerStyle阻当blindi"?Qstdp.L：eFwuI：*OrapShadow'Hn«rShacfl/iIOuMGlowI"n电"Gow1肘河i.d£m?as^!ContourITextureI।CoiofOveriavG,idtertgcfPatternOvtrlavl_&irokeOK)CancelNewSt^rle...MPreviewEffect:DropShadowColor:#000000BlendMode:MultiplyOpacity:75%Angle:90°Distance:2pxSpread:0%Size:5px另外，还有Menuicon另外，还有Menuicon、Statusbariconviewicon的设计教程请查看原文吧。、Tabicon、Dialogicon和List非常详尽的icon设计教程，一个程序里要放置三套icon,还有Android硬件比较好，不然内存爆掉了。iPhoneiPhone对于icon的设计建议：富有吸引力和可识别性。由于app软件可供全球的用户下载，所以在设计时，也要考虑到用户不同的文化背景。程序icon的设计：? 57X57像素，直角。?无发光效果。?无透明度。将图片命名为Icon.png,放置在程序的资源包中，iPhoneos会自动生成一个iconoiPhone的icon设计就这么简单，iPhone的屏幕只有320X480像素，所以程序没有适配性问题。iPhone界面-标准按钮和图标使用iPhone自带的按钮和图标的优势在于：?缩短开发时间。?增加界面的稳定性。当系统升级时，即使程序外观改变，这些标准按钮和图标依旧可用。工具栏和导航栏上的标准按钮有两种类型按钮:

?边框型。可以在导航栏和工具栏上使用。?普通型。适用于工具栏，如非要使用在导航栏上，会被转换成边框型。边框型ButtonMeaningName国Opensanactionsheetthatallaysus&rstotakeanapplicaton-specificadionAction回OpensanactionsheetthatdisplaysaphctopickeriricameramodeCamera回OpensanewmessagewiewineditrnodeComposeE3Shewapplication-spocilicbooh;marKsBookmarksDisplayasearchfieldSearchaCreateanewitemAddDelatecurrentitemTrash回Moveorrouteanhamtosdestinationwitinintheapphcation.suchasafolderOrganize□SendorrouteanitemtoanofiiericcationReplyaStopcurrentprocessortaskStopRefreshcontents[useoni>wliennecessary:otner^ise,refrestiautomaticatiy)Refresh□Beginiredisp格:七nekorslidesPlayFastforwardthroughmediaplaybackorslidesFastForwardmPausemeeftaplaybackorslid&sifiotethatthisimpliescantaxtpreseR'Gtion:PauseMovebackwardsthroughmediapaybackorslidesRewind普通型ButtonMeaningNameEditEditEnteraneditingorcontent-manipulationmodeEditCancelCancelExittheeditingorcontent-manipulationmodewitnoutsavingchangesCancelSaveSaveSavechangesand.ifappropriate,exittheeditingorcontent-manipulationmodeSaveDoneDoneExitthecurrentmodeandsavechanges,ifanyDone标签栏上的标准图标IconMeaningMameShowapiplication-sp«diicbaokmarksBcokmarics±ShowContactsContacts©ShowdownloadsDownloads★Showuser-determinedfavoritesFavoriias一■XShowcontentfeaturedbytheapplicationFcmtu「eiiShowhistoryofuseractionsHistoryShowad<liti^naltat)saritemsMorIQShowthemostrecentitemWostRe«nt山Showitemsmostpopularwith3MjsersMostVtewedOsnowtfieitemsrecessedbytheuserwithinanapplication-definedperiodRecentsQEnterssearchmodeSearch★Show为ahighest-rateditems,ssdetermin&^nytheuserTcpRated译自《IPhoneHumanInterfaceGuidelinesiPhone界面-状态栏和导航栏在深入研究iPhone界面的视图和控件之前，有必要理解这些元素的操作方式和隐喻含义。本文将介绍应用于大多数程序的视图，以及它们的属性和使用方式。

状态栏£/匕状态栏显示iPhone的重要信息，包括信号强度、网络连接和电池量。全屏式的程序是否隐藏状态栏需要慎重考虑，否则用户退出程序才能看到手机的状态，这样的用户体验并不理想。例如，拍照时用户的注意力集中在照片上，这时隐藏状态栏几秒钟是合理的，用户可以通过点击找回状态栏、导航栏和工具栏。如果非要隐藏状态栏，那也必须有利于用户体验，并且用户可以通过点击轻易地重现状态栏，但也不要为了重现状态栏而定义一个手势，用户不喜欢发现和记住这样的操作。Urier看。 *j尽管不能限定状态栏的内容，但是可以定制它的外观、大小和操作，具体而言:?是否显示网络连接。如果程序需要花费一小会时间连接网络，状态栏上的显示网络连接是有必要的。如果网络连接可以在瞬间完成，网络连接的图标也不是必须的，因为用户可能还没有注意到这个图标，程序已经完成网络连接了?状态栏的颜色。可以选择灰色、黑色或者透明的黑色，并设置状态栏的颜色是否动态变化

?确保状态栏和程序界面协调一致。例如，如果导航栏不透明，就不要使用有透明的状态栏导航栏Cdr2i£issintgi'tCdr2i£issintgi't导航栏显示在状态栏的下方，包括标题、按钮和分段控件。导航栏对于信息层次分明的产品应用型软件尤其有用。导航栏有两个作用：? 强调程序中不同视图的导航? 便于管理视图中的内容? 强调程序中不同视图的导航? 便于管理视图中的内容如上图，导航栏居中显示当前视图的标题导航栏中的标题随着界面的变化而更换，并且可以加上带有界面标题的回退按钮。标准的回退按钮明确用户返回到上一个界面，因此也避免改变按钮的操作方式，如上图的分段式回退按钮就是不可取的，这种作法容易导致如下几个问题：?分段式回退按钮占据标题的显示空间?无法显示单个片断的已选状态?分段越多，显示空间越少，也就难以点击?难以选择哪种方式显示分段式导航如果认为用户容易在程序中迷失，不用分段回退按钮而才采用面包屑路径，这可能就意味着用户进入深层次的信息才能找到他们想要的，这时更应该做的是减少信息的深度。除了回退按钮，在标题的右边还可以增加第二个按钮。如果不需要回退按钮的话（程序不支持分层式导航），也可以像上图一样在左上角加上一个作用于视图内容的按钮，如编辑按钮。导航上的按钮都有边框，如果在导航栏上放置一个无边框的按钮，程序会自动将其转化为有边框的按钮。按钮可以自己设计，也可以采用iPhone自带的按钮。导航栏上的字体也可以自定义，但是系统自带的字体更有利于阅读，当使用 UIKit创建导航栏时，系统将自动使用自带的字体。当手机竖屏变为横屏时，导航栏的高度会自动改变（不必定义导航栏的高度）。横屏幕的导航栏变窄，界面上可以显示更多的内容，所以在设计导航栏上的图标和界面上的图层时，要考虑到设计不同的高度样式以便适应导航栏的变化。导航栏的颜色和透明图可以自定义，也可以使用标准色彩：? 蓝色（默认值）? 黑色在导航栏上增加透明效果，尤其是横屏幕上，使得界面看起来的可视区域更大。但不要用半透明的导航栏结合不透明的工具栏，也不要在同样的显示方式下使用不同颜色和不同透明度的导航栏。iPhone界面-警示框、控件列表和模态视图使用方法和行为6BQBQQQQ«123 —MieAhrl6BQBQQQQ«123 —MieAhrl警示框、控件列表和模态视图迫使用户点击按钮之后才能继续使用程序，尽管它们时常警告用户潜在的危险或者提供额外的选择，也要避免过度使用，原因在于:?所有类型的模态视图都会打断用户的工作流。?需求确认或者承认视图的频繁出现更让用户厌烦。尤其是当警示框出现太频繁时，用户会直接关闭它们，而不是阅读警示框上的文字并在考虑之后点击按钮。?警示框提示程序的重要信息。警示框的出现通常很意外，因为它们一般告知用户需要当前程序上出现的问题或者改变采用行动。?控件列表提供用户更多可选择的控件。当点击工具栏上的按钮即不是破坏性操作 （如删除已拨电话），也不是完成多步骤操作时（如发邮件） ，用户期待界面上会出现控件列表。?模态视图在当前任务情境中提供更多的功能，也可以直接执行和用户工作流有关系的子任务。警示框的应用突然在界面中间弹出并浮在界面上的警示框能明显地提示用户一些关键信息。警示框的外观强调其出现是由于程序和设备的改变而引起的，但不一定归咎于用户最新的操作，警示框上文字解释当前的状况并引导用户完成操作。使用警示框告知用户任务被阻止是很重要的，而且要提供可选择的方法去处理警示框。警示框可以给予用户两个按钮，接受或者拒绝潜在的危险，也就是关闭警示框并执行命令或者关闭警示框并不执行命令（通常为“取消”按钮）。请谨慎使用警示框，并保证每个警示框提供关键信息和有效的选项。一般而言，避免创建以下形式的警示框：?更新用户的正常进度的任务。而应该使用进度条或者活动指标来提供进度上的反馈给用户。?对于用户启动的行为进行询问确认，应该使用控件列表去确认用户启动的命令，甚至是潜在的危险命令，如删除联系地址。?告知让用户束手无策的错误或者问题。尽管告知用户无法处理的关键性问题是有必要的，但如可能，最好将信息合并在界面上。例如，与其告诉用户链接服务器每次都失败了，不如显示最后一次链接成功的时间。

警示框的设计警示框的文字、按钮的数目和按钮上的内容都可以自定义，但其背景不可以改变。对于用户而言，在两者之间做出选择是最容易的，警示框上的按钮数目最好也是两个，如使用单个按钮，用户将没有选择的余地。因为用户有时并不仔细阅读警示框上文字就进行操作，所以要高亮右边的按钮作为默认选项。比如点击“取消”按钮可以避免无意操作而执行危险的命令，如果不是破坏性的操作，可以执行最普遍的操作。设置警示框上的按钮的方法:?警示框上有两个按钮时，左边的按钮通常使用深色，而右边的按钮从不使用深色。如操作有潜在危险时，“取消”按钮应该在右边并使用浅色；如操作没危险时， “取消”按钮应该在左边并使用深色。?警示框上有一个按钮时，按钮使用浅色。上文提到用户有时不会仔细越多警示框上的文字，所以文本内容和标题必须简明扼要，有时，描述状况或者事件的标题就足够了。但也不要创建无法传达有效信息的单词类标题，比如“错误”，作为标题无法告知用户为什么会出现警示框。事实上，在任何界面上都尽量避免出现“错误”字样并描述实际情况。如果使用了同样的标题，而警示框是由不同原因触发时，就需要增加句子或者信息去提示用户更为详细的信息。如果标题对于信息的传达并没有任何帮助时，可以将标题去掉。控件列表的应用控件列表集合了通过点击而启动任务的选择性按钮，通常应用在：?提供完成任务的多个可选方式。例如在拍照功能中，控件列表提供发送照片的三个目的地。?在完成具有潜在危险的任务之前获取确认。例如，根据邮件设置，点击工具栏上的垃圾箱按钮，通过控件列表删除邮件或者取消删除。控件列表的设计控件列表的背景须和程序界面相协调，按钮的数目可以自定义，作为用户操作（如点击删除或者发送按钮）的的结果，所以无需像警示框一样加上文字说明。

如果操作具有潜在的危险，比如删除所有的购物列表，应该使用红色的按钮提醒用户，而且要将这样的按钮放在控件列表的顶部：?顶部的按钮，视觉更明显。?有时用户在试图点击“Home”按钮时，意外地触发了控件列表，将有危险性的按钮放在底部会增加误操作的概率。可以在控件列表上设置多个按钮，但要确保每个按钮都容易辨认。模态视图的应用模态视图默认从界面底部滑出并占据整个界面，并短暂地显示与之前不同的界面，直到用户完成某项操作。尤其适合于主功能界面中欠缺的包含了地址和消息文本、输入光标、模态视图完成和程序主功能有关系的独立任务,多级子任务。例如撰写新邮件时的模态视图，取消和发送按钮。

尤其适合于主功能界面中欠缺的包含了地址和消息文本、输入光标、模态视图的设计标题通常定义了模态视图的类别，也可以加上和任务或者导向有关的文字描述。比如短信程序包括了导航栏、标题“新短信”、取消按钮和文本输入区域。为了让用户意识到模态视图是过渡性的操作，可以指定以下切换方式：?竖向移动。模态视图从屏幕的底部滑进滑出。?翻转。当前界面切换到模态视图时从右到左翻转，视觉上看起来模态视图好像在当前界面的背面。为了让用户易于发现和记住，最好使用风格统一的翻转方式。iPhone界面-创建自定义图标和图片iPhone界面如此精美，作为一名设计师，要充分利用iPhone已有的界面元素，根据iPhoneOS图标设计准则去设计自定义图标或者图片，比如每个程序的图标、启动图片和呈现在iPhoneOSSpotlight搜索结果中的小图标需要自定义。iPhone中图标和图片的标准位深度为24位（红绿蓝各8位），加上8位的alpha通道，推荐使用PNG&式。程序图标程序图标放置在手机程序主界面上，点击之后可以启动程序。如上图， iPhone可以将图片自动加上阴影、发光和圆角效果。程序图标的设计：? 57X57像素，直角。?无发光效果。?无透明度。小图标小图标显示在Spotlight搜索结果和手机设置中。小图标的设计：?PNG格式。? 29X29像素。

启动图片启动图片类似于开机画面，是用户点击程序图标之后看到的图片， 几秒之后才会显示应用程序的主界面。启动图片的设计：?PNG格式? 320X480像素，可以临时改变状态栏的颜色。?启动图片和应用程序的主界面的背景相似。导航栏、工具栏和标签栏上的图标自定义图标要和系统自带的图标有明显的区别，其设计：?PNG格式。?纯白色的alpha。?无阴影。?抗锯齿。?如增加斜角，必须为90度。?工具栏和导航栏上的图标大小为 20X20像素；标签栏图标大小30X30像素。iPhone会在自定义的图标加上装饰效果，比如按下或者选中的效果，所以也不必创建一个全彩色的图标。iPhone界面-优秀程序的特征优秀的iPhone程序是在恰当的时候提供用户需要的内容。简单易用简单易用是所有类型软件的基本准则，但在iPhone程序设计中尤其重要。iPhone用户在使用手机时可能还在做其他事情，如果用户无法轻松地使用程序，他们可能回到电脑前再也不使用iPhone程序了。简单易用的方法：?操作方式一目了然。优化控件的数目，使程序的主功能显然易见，引导用户操作。?使用频率高的信息放置在屏幕顶部。 无论用户是单手操作，还是一只手拿着手机而另一只手的拇指点击屏幕，屏幕的顶部最显眼并且最易于点击。?最少的文本输入。过多的文本输入是在浪费用户的时间和精力，如非要输入，请保证“物有所值”，用户会感觉到并没有因为输入而耽误了任务完成。?简洁的信息。突出重要信息，便于用户快速浏览。?便于点击。44X44像素及其以上的按钮尺寸便于用户的拇指点击。关注首要任务关注首要任务是用户对于程序满意度的重要因素。所以在设计时，要保证界面上的每一个元素的设计都取决于当前首要任务，用户完成任务是否需要这些元素。举个具体的例子，这些信息或者功能对于用户购物是否有帮助呢？如果不是， 这些信息或者功能是否在另外的使用情境中至关重要吗？

如上图，日程中有当前日期和事务安排，最重要的是显示这两者之间的联系有效沟通有效的

可以提程序需要让用户知道任务是否正在运行中和操作导致的数据丢失等问题，沟通和反馈对于程序非常重要。应用动画就是有效沟通的一种重要方法,供有用的反馈信息，直观地显示用户操作结果。

有效的

可以提如上图，程序中的文本要以用户为中心，避免在界面中出现技术性的语言译自《IPhoneHumanInterfaceGuidelines»原型工具BalsamiqMockupsBalsamiqMockup是一款草图风格的原型设计工具，更为准确地说是低保真原型设计工具，可避免过早地陷入细节。?操作简单?预置了多种界面元素，如iPhone和Android?导出多种格式，如png、pdf?基于Adobeair?支持中文，设置方法： view>usesystemfonts桌面软件网页设计iPhone界面设计buluiruqtmrepdyjA 口qpmSofeSwdiMairflfe>BalsamiqMockup并非免费软件,没有key只能试用并不能保存，但官方网站上也提供了获取key的各种方法，比如写篇这样的博文。^eorchabitTrttnfV«iccXar(h(5th$tr«.3t3皿S«ardiVlrXrck4R*ywifiiin ElbuluiruqtmrepdyjA 口qpmSofeSwdiMairflfe>BalsamiqMockup并非免费软件,没有key只能试用并不能保存，但官方网站上也提供了获取key的各种方法，比如写篇这样的博文。^eorchabitTrttnfV«iccXar(h(5th$tr«.3t3皿S«ardiVlrXrck4R*ywifiiin El■oHeeb«+INorH,aC-LAfltS,ABC'3G DI.45H*AK3fiOlill&kh*□制*twerkP.i/Biikdni^OtherUititkdvia〜HI"二OI口t1-*- ■Irwitocw**7回■w：——KramntiwrtjwBbrj06tdanMUhc叫If4S' ~*«vrk>qrawIMAo,ywuvpHXaihidbvf«rvjpBrmgawvMTvnrt.EEgiWhHNewrlo1：3JD3I0CKIQiBffff；3■一口■昨大小试一把，绘制了iPhone界面概念设计图，效果真的很好。需求规范化管理需求处理流程收集需求一分析需求一提出设计方案一修改代码一测试需求处理共需要三个周期。产品组第N周期中收集需求、分析需求和提出设计方案。第N+2周期中跟踪需求完成情况。收集需求产品组负责将这些需求来源和需求内容，需求主要来源于：?功能开发需求。?CCB会议中用户体验修改建议。?用户建议（主要通过客服获得）。?运营部和市场部的需求。?产品组用户体验修改建议。分析需求?需求是否合理。不合理需求给出理由，小部分无法准确判断的需求提交 CCB会议讨论。?评估该需求影响用户体验的指数。提出设计方案第N周期的最后一天同时提交设计方案给开发组和测试组跟踪需求判断需求的完成情况。开发组第N+1周期中根据设计方案修改代码。开发组对于零碎的需求不处理，此周期中收到的需求安排在下一个周期中修改。测试组第N+1周期中根据设计方案修改测试用例，判断代码的修改是否涉及主干流程，安排第N+2周期中的测试内容。需求规范化目的?保证每项需求都得到处理。?需求可跟踪，每项需求记录在案。?产品组提高设计质量，避免重复设计。?开发组避免重复修改代码，减轻开发组压力。?利用测试组，保证设计的执行力。?有序地迭代。wap翻页程序wap翻页程序总结出以下设计原则：.避免输入.便于点击.简洁.按方向键进入翻页程序时，第一个控件是“下一页”.显示总条数或者总页数.页面可以跳着翻方案草图方案h 灯条|（y-F）摩0］页3径|（上一式JI（〒一.）除图页方案人 共仍嗓I000I30E口…国（上一页］（下.式）为耍目0000E□□（上一页）（下一页）方Q匠立目目回国…国E3>OQE00-国方案第 田（1/18R）每瓦显示t5|110|20HO近£>Q页）（M网每一显示f5110|20|40方案解释方案1:满足原则2/3/4/5Z6方案2:满足原则1/2/5/6方案3:满足原则1/2/4/5/6方案4:淘宝wap的方案，满足原则1/2/3/4/5，另外还可以更改每屏幕显示的条数流程图android手机客户端交互设计iPhone界面设计流程图android界面设计流程图e指通客户端功能介绍主界面e指通精彩通通无限通 常用功/4冈区冈冈区ibcopyright02008-201Oubi电影票r+q旦彩票手机充值数字点卡机票图安推荐奸友菜单左右键切换主功能上下候选择子功能退出比飞行不会先