主页 > 洞察 > 设计沙龙 > APP设计
  • 开发APP时,APP的UI界面如何设计?

    adinnet / 2019-11-05 13:53 /APP设计

       APP开发的人员都希望自己的APP能在众多的APP中脱颖而出,那app界面设计占据着重要作用。APP页面设计有很多注意事项可以让程序后期开发省力省资源,而且只有真正抓住用户的心,开发出用户体验良好的APP才能在同行竞争中有优势发挥APP的真正作用。当然不同APP类型,首页设计也是因平台而异的。比如内容资讯类的APP,多数在首页采用无限加载的形式,通过个性化的展示,吸引用户深度阅读、评论互动和分享转发等等. 来增加用户停留时间;高频使用自己的APP,所以很多APP首页大多是主要功能界面或突出功能Action,简单直接。那么我们APP的界面设计有什么需要注意的呢?以下内容就是上海艾艺提供给大家参考的。

    一、信息显示相关

      APP的界面在涉及到字段信息时的文字输入,必须要降到最低,尽量使用真实可能出现的直观信息,由于手机在输入上的低效性,所以在ui设计的过程中,应尽量减少用户的输入,如果有可能可以设置默认值,或者可以选择目标值。我们还要避免设计一个信息卡片就复制在整个页面,抛开视觉不舒适的问题,从开发规则上就很容易出现想象不到的问题。

    二、图像的分辨率相关问题

      设计师们开发APP的界面,应该要从高像素的屏幕尺寸开始开发,根据小尺寸屏幕逐一进行比例缩放,这样才能向下兼容相关的移动终端屏幕。我们在屏与屏之间的逻辑关系要清晰。由于手机屏幕普遍较小,即使有4寸屏,那也只能展示较少的信息量,因此,在设计的时候,更需要有清晰的信息架构,让我们用户知道当前在哪儿,并能返回到哪儿。还可以借助位图操作等方式来处理好高像素图片缩放带来的图片像素不足的问题。假如我们的APP选择采用过渡的动画应该控制好加载时间,加载过程中做到过渡平滑自然,主要从图片到动画视频间的过渡,以及更应该注意的是APP加载过程中因为程序异常或者网络原因带来的白屏等问题,当出现白屏的时应该加入进度条以告知用户当前的加载进度,而不是让用户盲目在界面过渡的加载中长时间等待。这样会影响用户的体验感,很多没有耐心的用户都会退出停止使用。

    三、触摸界面设计

       手机APP界面的触摸区域要根据用户的手指宽带来设计,同时还要考虑用户手指在屏幕触摸滑动过程中可能会出现点位触摸不准之类的问题,否则用户在快速触摸过程中容易带来APP上的一些误操作,所以界面上的按钮一定要足够大,触摸响应延迟尽可能减小,还要防止用户多次重复触摸带来的APP响应异常。APP设计的操作和app界面触摸按钮不要隐藏太深,重要功能都需要在界面中有适当的提示。因为手机屏幕小不能展示所有的信息。所以对重要的、使用频率高的功能栏目或信息放在最重要的明显位置,并在首页上展示或指示。

    四、界面字体相关

      字体是UI界面的设计的重要选择之一,恰当的字体运用可以让我们产品的定位和内容的轻重感加倍的表达突出。尤其是内嵌字体,成为了很多追求完美的App设计师的一个解决方案。另外,整体界面必须简洁、操作简单,由于用户操作情景复杂,在使用APP的过程可能有额外的认知负荷,因此,在开发app的过程中,逻辑必须简单,操作步骤也要减少。记住一条理念,复杂的事情留给自己,简单的事情留给用户。

    五、APP的UI元素

      设计师在设计PC的界面时,也要在实际的移动终端设备上预览下效果,再决定是否要放置这么多的UI元素。假如界面上堆积太多UI元素,容易导致页面杂乱和重点不清,更影响到APP功能上的展示效果。用户在操作手机时,往往不会一直盯着手机屏幕看,很多手机状态页面的切换,都会脱离了用户的视线,这时app设计开发必须要提供视觉之外的其他感觉通道的信息(像听觉、触觉等),用来对用户做提示。其实,越是简单的元素越是考验设计师能力,譬如白底黑字,或是黑底白字。白面之上,黑字是字也是装饰,是点也是线。通过调整体积和间隔,错落地形成画面,构造韵律。

    timg.jpg

    六、APP的界面风格及案例

    在做APP的界面颜色搭配时,也许仅仅用一个主色调,是不是就能够很好的表达界面层次和轻重的突出,并且能展示出良好的视觉效果?事实上的确如此,随着iOS的最新发布,我们看到越来越多唯一主色调风格的设计,会采用简单的色阶,配套灰阶来展现信息层次,绝不采用更多的颜色。看上去更加的简单明朗,协调也更加的统一,不在容易出现审美的疲劳和杂乱感。

    分享案一:像卡塔尔公司航空就是整个界面采用粉色的主色调,从标题栏到标签页,从操作按钮到提示信息,除了黑白灰之外,全部采用粉色设计,这种简介的的配色风格,反倒起到了很好的信息传达效果,也具有良好的视觉表现力,设计师在内容排版上的技巧实在是加分。Readability采用红色主色调设计,连提示信息背景色、线性按钮和图标都采用红色主色调,界面和LOGO也完全是一个色系的。而Vivino采用蓝色主色调设计,信息用深蓝、浅蓝加以区隔。Eidetic采用橙色主色调设计,其中的关键操作按钮甚至整个用橙色提亮,信息图标也用深橙色、浅橙色来表达程度。

    分享案二大家所知道的优衣库出品的RECIPE是让人眼前一亮的设计,把多色的风格融入到整个APP界面设计中,不论是切换标签页,还是在内容组块中滚动,都会变更不同的主题色。在进行色彩切换的时候,还会有淡入淡出的效果,让切换变得自然而然,完全不生硬。

    结语:我们APP的UI项目,单色调、多色彩、信息数据可视化、卡片化设计、阅读类设计、圆形与多边形妙用和大视野、立体、透视等效果背景图。其实这几种设计风格很难有全新的,也是不断轮回的过程,为凸现内容APP都在往轻薄化方向设计,不过保不准哪天,又颠覆回最开始的重质感拟物话设计呢。用户界面关系到移动应用的成功与失败。优秀的布局,需要对页面信息进行完整的考虑。即要考虑用户需求、用户行为,也要考虑信息发布的目的、目标。设计师在设计页面时,需要不断的从两个身份之间自由切换,以设计者的身份去设计出美德,再以使用者的角度去审核设计的实用性,易用性等,这样才能设计出一个好的页面。》》请点击我,  欢迎咨询

上一篇:【APP开发价格表】2021年上海APP开发需要多少钱? 下一篇:「物流app开发」物流类app开发解决方案