ios手机app制作开发流程规划功能-线框稿(二)

  二、规划功能

  有了一个点子,思路自然会往下延伸,用更多的支线来强化点子的可行性。就像思考晚餐要吃什么,西式中式?面类饭类?哪家餐厅?位置在哪?要不要排队?巴拉巴拉可以想出一堆问题。所以在这个阶段,思绪会很杂,有个帮助思考的好方法:拿纸笔写下来。在写的过程中可以把记忆所要耗的脑力空出来作为思考用。

ios手机app制作开发流程规划功能-线框稿(二)-梦幻科技

  举文字编辑器为例,提到文字编辑时,马上想到的功能大概有:

  要有打字的地方

  说到打字又想到文字如果可以换颜色就太棒了

  还有换字体

  最好字体大小也能换

  那对齐方式?

  好像也可以换

  想到这么多能换的

  不如背景颜色也开放给使用者换掉

  还有什么功能?暂时没了

  这是我的思路。每个人思路一定不同,反正想到就记录在纸上,什么方法都可以,我习惯的是条列式,并且列数字在前头,方便计算现在总共有几项功能。

  此时功能的数目很关键。太多会让使用者无从下手;太少的话程序又显得乏味。我的精炼方法是整理每个功能的互动关系,彼此有关系的就用线连接起来,跟彼此没有连接关系的功能,就把它删掉。下面是最后整理出的关系图。仔细看可以发现文字对齐虽然有在图片里,但最后成品里其实没有出现,那是因为它比起文字颜色,在整体安排上更显得突兀,所以在之后的流程中我把它们替换掉了。

  Image for post

  整理功能间的互动关系

ios手机app制作开发流程规划功能-线框稿(二)-梦幻科技

  三、线框稿

  线框稿有点类似草稿,用它来规划每个页面、每个元素间的关系非常方便。一位学设计的朋友曾经分享了一个很实用的作法:每个元素可以用剪纸方式,拼在纸上,模拟操作时就很方便调动位置,拿来用在跟人讨论也很有帮助。

  Image for post

  「方便面」线框稿,到了程序步骤还是做了些许调整

  线框稿可以依循的地方有:

  1.屏幕热区:有些位置特别方便单手手指操作,适合把重要或常用功能放在热区里。

  2.相关的元素放一起:使用者通常会把相近的元素视为一类,把相关的放一起,有助于让使用者一眼理解操作方式。

  3.以简单为原则:化繁为简,不常用或进阶的功能可以隐藏起来。

  4.排版方式可以参考热门应用程序:对于一个新系统,使用者偏好以过去养成的旧习惯去理解与操作,熟悉的操作模式让人容易上手,马上留下好的第一印象。


联系我们

13751415268

853408942

:853408942@qq.com

:9:30-22:30

QR code