首页 app开发 正文

app设计信息架构图(APP信息结构图)

app开发 175
本篇文章给大家谈谈app设计信息架构图,以及APP信息结构图对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。 本文目录一览: 1、软件架构:APP架构设计图(Android/IOS)

本篇文章给大家谈谈app设计信息架构图,以及APP信息结构图对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。

本文目录一览:

软件架构:APP架构设计图(Android/IOS)

准备做新的APP,先架构设计。

主要的要求:

1.层级职责清晰、单一;

2.模块间独立解耦;

3.......;

下面贴出几张主要的图吧

怎么分析一款App?

1.怎么分析一款App?

首先我也是听了黑马程序员的公开课才了解到这么多的,既然是做产品分析,那么产品分析可以包含的方面比较多,可以包含以下方面:

(1)产品定位分析:为哪些人解决了什么问题?

(2)用户需求分析:需求点是什么?使用场景是什么?

(3)产品市场分析:市场容量如何?竞品如何?

(4)产品功能分析:产品的功能架构是什么?主要的一些功能模块的设计逻辑分析?功能的好坏?

(5)产品UI分析:页面的排版,设计风格、设计与产品定位的关系如何?

(6)产品交互分析:某些功能和页面的交互设计合理性?

(7)运营方面分析:某些社区类产品的运营方式是否合理?运营的策略是否能达到效果?

除了上面以外,也可以用一些其他方面的分析,但主要还是跟产品的生命周期相关的一些角度去进行分析。

安卓app的开发架构图该怎么画

android应用开发框架是ApplicationFramework.其系统架构由5部分组成,分别是:LinuxKernel、AndroidRuntime、Libraries、ApplicationFramework、Applications。第二部分将详细介绍这5个部分。下面自底向上分析各层。Android架构1、LinuxKernelAndroid基于Linux2.6提供核心系统服务,例如:安全、内存管理、进程管理、网络堆栈、驱动模型。LinuxKernel也作为硬件和软件之间的抽象层,它隐藏具体硬件细节而为上层提供统一的服务。如果你学过计算机网络知道OSI/RM,就会知道分层的好处就是使用下层提供的服务而为上层提供统一的服务,屏蔽本层及以下层的差异,当本层及以下层发生了变化不会影响到上层。也就是说各层各尽其职,各层提供固定的SAP(ServiceAccessPoint),专业点可以说是高内聚、低耦合。如果你只是做应用开发,就不需要深入了解LinuxKernel层。2、AndroidRuntimeAndroid包含一个核心库的集合,提供大部分在Java编程语言核心类库中可用的功能。每一个Android应用程序是Dalvik虚拟机中的实例,运行在他们自己的进程中。Dalvik虚拟机设计成,在一个设备可以高效地运行多个虚拟机。Dalvik虚拟机可执行文件格式是.dex,dex格式是专为Dalvik设计的一种压缩格式,适合内存和处理器速度有限的系统。大多数虚拟机包括JVM都是基于栈的,而Dalvik虚拟机则是基于寄存器的。两种架构各有优劣,一般而言,基于栈的机器需要指令,而基于寄存器的机器指令更大。dx是一套工具,可以将Java.class转换成.dex格式。一个dex文件通常会有多个.class。由于dex有时必须进行最佳化,会使文件大小增加1-4倍,以ODEX结尾。Dalvik虚拟机依赖于Linux内核提供基本功能,如线程和底层内存管理。3、LibrariesAndroid包含一个C/C++库的集合,供Android系统的各个组件使用。这些功能通过Android的应用程序框架(applicationframework)暴露给开发者。下面列出一些核心库:系统C库--标准C系统库(libc)的BSD衍生,调整为基于嵌入式Linux设备媒体库--基于PacketVideo的OpenCORE。这些库支持播放和录制许多流行的音频和视频格式,以及静态图像文件,包括MPEG4、H.264、MP3、AAC、AMR、JPG、PNG界面管理--管理访问显示子系统和无缝组合多个应用程序的二维和三维图形层LibWebCore--新式的Web浏览器引擎,驱动Android浏览器和内嵌的web视图SGL--基本的2D图形引擎3D库--基于OpenGLES1.0APIs的实现。库使用硬件3D加速或包含高度优化的3D软件光栅FreeType--位图和矢量字体渲染SQLite--所有应用程序都可以使用的强大而轻量级的关系数据库引擎4、ApplicationFramework通过提供开放的开发平台,Android使开发者能够编制极其丰富和新颖的应用程序。开发者可以自由地利用设备硬件优势、访问位置信息、运行后台服务、设置闹钟、向状态栏添加通知等等,很多很多。开发者可以完全使用核心应用程序所使用的框架APIs。应用程序的体系结构旨在简化组件的重用,任何应用程序都能发布他的功能且任何其他应用程序可以使用这些功能(需要服从框架执行的安全限制)。这一机制允许用户替换组件。所有的应用程序其实是一组服务和系统,包括:视图(View)--丰富的、可扩展的视图集合,可用于构建一个应用程序。包括包括列表、网格、文本框、按钮,甚至是内嵌的网页浏览器内容提供者(ContentProviders)--使应用程序能访问其他应用程序(如通讯录)的数据,或共享自己的数据资源管理器(ResourceManager)--提供访问非代码资源,如本地化字符串、图形和布局文件通知管理器(NotificationManager)--使所有的应用程序能够在状态栏显示自定义警告活动管理器(ActivityManager)--管理应用程序生命周期,提供通用的导航回退功能5、ApplicationsAndroid装配一个核心应用程序集合,包括电子邮件客户端、SMS程序、日历、地图、浏览器、联系人和其他设置。所有应用程序都是用Java编程语言写的。更加丰富的应用程序有待我们去开发!从上面我们知道Android的架构是分层的,非常清晰,分工很明确。Android本身是一套软件堆迭(SoftwareStack),或称为「软件迭层架构」,迭层主要分成三层:操作系统、中间件、应用程序。从上面我们也看到了开源的力量,一个个熟悉的开源软件在这里贡献了自己的一份力量。

交互总结篇(一):框架布局篇

上篇文章里面简单介绍了一下关于交互设计分析的三维度,即框架、流程和状态;这里就不做特殊介绍了,详细内容请见 《三维度解析一个产品的交互设计》 。

而本文作为交互设计总结篇的第一篇——框架布局篇,主要是系统地整理一下交互框架设计所需要考虑到的方方面面。

首先我们要先理解一个概念:

什么是交互框架? (主要是指互联网产品)

框架是整个或部分系统的可重用设计,表现为一组抽象构件 及构件实例间交互的方法

这是官方的定义,翻译成人话就是搭建一个产品能够使其可拓展,规范化,有条理,可快速迭代优化的方法。好像还是不好理解,让我们举一个通俗易懂的例子:假如我现在有个空房子,我要重新改造它,那么我首先要考虑的就是其房间结构( 也就是框架 ),比如我要设计几个卧室,几个客厅,分别占多大面积,在什么位置等等( 信息架构 );然后还要考虑如何设计门和窗户,怎么能够在不同房间互通( 导航方式 );接着再思考每个房间里面分别需要怎么布局,分别需要哪些家居和电器,具体在什么位置( 页面结构 );然后再不停的细分下去,直到考虑全每个细节,那么一个产品完整的框架就基本上搭建出来了~

理解了框架的概念后,可能我们还是会有疑问:

为什么要做框架设计?

还是上面房子的例子,假如我不考虑房间布局,随心所欲地将我的家具和电器到处摆放,我将卧室放在房子的最里面,我需要依次穿过客厅、厨房、洗手间才能到到达;我将马桶放在卧室,把床放在客厅,把厨具放在洗手间,把衣柜放在阳台,把洗衣机放在厨房……各位可以想象一下你的房子要是要被设计成这样你还想住吗?同理,一个框架结构混乱的产品你的用户也是不会用的。但凡在行业里有些影响力的互联网产品,其产品的框架和结构必定是由产品和设计人员精心思考并设计过的。框架是一个产品的骨骼和经脉,它是一个产品能用与否的基础所在,所以在开始产品设计之前先进行框架结构的梳理是非常非常重要的!

那么对于交互框架:

我们又该如何去思考和设计呢?

我将其总结为3个步骤:

对于产品和设计来说,这个词肯定是不陌生的,那么信息架构是个什么东西呢?

这就是某app产品的信息架构图,通过不同级别的分类,将其所有的功能点展示出来的一个功能信息框架图。一般来说这种架构图主要是由产品产出,而有些比较专业的交互前期也会参与其中,下面还是以设计房子为案例来探究一下信息架构到底该怎么做。

首先我们要想清楚房子有几个房间,分别需要哪些家居和设备(收集需求)

收集完需求后,我们需要开始对需求进行整理和分类,这里整理的规则可以参考 卡片分类法和卡诺模型 :

整理完成后最后产出信息架构图:

信息架构完成后并没有结束,你还需进一步思考: 还有没有其他问题呢?有没有漏掉的功能?功能分类有没有问题?这个框架拓展性如何?结构是否足够扁平? 等等……如果不考虑清楚那么就很有可能会出现马桶被摆放在卧室这种情况了。

当信息架构确定好了之后开始思考第二步:

导航就像是房子里面的门,是贯穿整个产品的入口,导航做的好的能让用户快速达到目标,导航做的不好会让用户迷失在茫茫的信息海洋中不知所措,目前在app业内主要的导航模式有3种: 选项卡式导航、抽屉式导航和跳板式导航。

选项卡导航:iOS上又叫Tab bar,典型代表像淘宝、微信,这类产品相对体量较大,产品结构和流程逻辑也都较为复杂多变;

抽屉式导航:代表如滴滴、摩拜等,这类产品都有一个很共性的特点就是“单线程”,即用户目标明确,操作流程单一,属于“强流程,弱框架”的类型。

跳板式导航:也叫9宫格式导航,典型代表如美图,这类产品也有着比较鲜明的特点“多线程单流程”,即功能入口较多(一般5个以上),操作流程单一,常用于美图类产品和一些B端类产品。

虽说不同的产品形态决定了其不同的导航模式,然而业内几乎90%的app都是采用选项卡导航,选项卡式导航的确拥有非常显著的优势:结构简洁清晰,操作便捷,拓展性强,稳定性好,确实是很多app首选的导航模式,然而并非一概而论, 你所选择的导航一定是跟你的产品类型和框架结构相互关联的,滴滴采用抽屉式导航而非选项卡导航是由其产品本身属性所决定,豆瓣一刻的导航采用抽屉式是因为本身产品框架结构较为简单的原因。 所以采用什么导航方式要灵活变通,没有最好的只有最适合的,比如下面3个例子:

片刻使用的是驼式导航,是选项卡导航的一种变形,强化了某一个重要或高频繁操作的功能,多用于博客类,直播类app中;

好奇心日报用了一种很罕见的悬浮导航,至于为什么会这么做,各位可以自己去思考;

Hyperlapse更是大胆,它根本就没有导航,这个产品全身上下就只有一个功能;

结合自己产品类型和框架结构,灵活选择导航,不要拘泥于形式,多尝试多思考,总会发现最合适的那个。

完成导航设计后,来到最后一个步骤:

页面结构即页面布局,是针对单个页面不同控件和元素的布局展示关系,就像房子的房间大小位置都设计好了,那么接下来就考虑每个房间里面该怎么添置家居了,比如卧室里面的床,衣柜,台灯,空调等等这些东西该怎么布置,分别放在什么方位,具体占多大位置,这样摆有什么影响等等,房间里面布局的好坏影响空间的运用,也影响了房间的美观整洁和整个房子的格局风格,同理, 页面的布局好坏就决定了用户的使用和阅读体验,决定了整个产品的调性和品位,最终影响了产品的转化。

那么一个优秀的页面布局具备哪些特点呢?

1、主次分明,结构清晰:

结构清晰的页面各个元素和控件处理的非常得当,相反结构混乱的用户的关注没有焦点,看了很长时间都不知道你的页面想表达什么,也不知道该如何操作,下面看两个例子:

12306的首页结构看起来似乎毫无层次感,页面结构就像是随意的信息排列,再看看智行的首页,卡片式结构视觉焦点更清晰,信息的排版和布局也更有层次感。

2、化繁为简,引导清晰:

特别是移动端产品,手机屏幕尺寸有限,如何在最短的时间里吸引用户的眼球, 设计师需要做的是做减法,删除干扰用户的不必要的内容,强化核心的操作流程,快速引导用户达成目标。

让我们再看一下上面12306的首页,可以发现它的查询页面包含了出发点、目的地、出发日期、出发时间、席位、车次筛选和添加乘客,也就是说用户需要浏览这些信息后然后再进行一步步的操作选择,等这些全部设置好了之后估计票早都抢完了,而智行就机智了很多,它将出发时间,席位,添加乘客等非重要信息进行了删减,就连车次筛选也只是用了开关设置,所以大大提升了用户的查询效率。操作指引方面,出发时间是一个非常重要的必填操作,智行对于时间选择有比较强的引导,而12306的出发时间根本看不出来是可以点击操作的。

3、操作方便:

这里操作方便更多适用于移动端,特别是现在手机尺寸普遍越来越大,用户单手操作越来越困难,所以我们在设计页面结构布局的时候也是要考虑到人体工程学的,特别是某些特殊场景使用的app,比如地图类应用,用户使用场景多在户外(步行、骑行、公交车),用户单手操作的场景非常之多,如下图所示:

左图是用户单手操作的触摸区域图,从图中可以看出界面的左上区域属于触摸困难区,下方是舒适触摸区,所以在处理页面信息布局的时候就可以考虑将重要展示类信息放在页面的头部和中部,而需要操作类的控件和按钮可以考虑放在下方用户容易操作到的区域。我们再看右图,是高德的首页,我们可以看到高德的头部有个搜索框,是属于重要按钮控件,然而却放在了头部用户难操作的区域,那么高德当然也意识到了这个问题,于是乎他们在页面的底部放了一个“路线”入口,能够让用户在单手操作的情况下同样也能快速完成路线查询。

其实关于页面结构,设计师们要考虑的点很多,也不仅仅单纯地用几个点就能完全涵盖进去的,不同的产品属性会决定其框架和导航,也决定了其页面的展示布局,比如网易新闻和淘宝的信息展示方式就完全不同,一个是浏览,一个是逛,两者间的使用场景和用户心理是完全不一样的。即使是同一属性的产品其页面结构和布局也是千差万别的,比如下面4个例子:

虽然都是互联网金融产品,也都是展示首页,然而可以看到每个产品的首页展示形态完全不同,有的主推产品和收益,有的引导登录购买,有的主推运营活动,有的主打社区互动, 究其背后形态各异的原因跟其产品定位与运营策略有重要的关联,设计师们分析产品的时候不仅仅需要从设计本身出发,还要思考更多背后潜在的原因,从而达到真正意义上的“闭环”。

好了说了这么多,最后总结一下,产品交互框架设计需要经历的3个步骤:

1、信息架构: 功能需求的筛选与分类,根据不同权重和属性进行级别的划分;

2、导航模式: 根据产品属性和产品架构来选择最为合适的导航方式;

3、页面结构: 结构主次分明、结构清晰、引导明确以及操作方便是一个优秀的页面结构的必要条件;

框架是死的,人是活的,设计的思维大多都是发散的,合适的方法论确实能够在关键的时候提供思考的方向,但不可固步自封,设计师需要不停地学习、思考、交流、总结、创新,因为这个过程本身才是设计最重要的意义~

(待续……)

拆解一款app的正确姿势——交互篇

对于如何正确拆解一款app,我想首先应该明白它的组成,就如要拆解一辆汽车,我们要知道,汽车主要是由外壳,底盘,发动机,轮胎变速箱等等主要部件组成。同理,一款完整的app是主要包括 产品战略层,交互逻辑层,UI视觉层,开发后台层,以及最后的运营推广层组成。每一个层次都可以进行详细拆解分析,但如题所说,这里我们着重分析拆解交互逻辑层。

拿到一款app,首先映入我们眼帘的是UI视觉,好比一辆车的外壳,但是我们要看的是它的核心骨架——即信息架构,这时我们应该拿出纸和笔或者用如Xmind之类的工具将app中的信息架构图以树状图的形式画出来,这样我们可以对app有个总体的认知。

众所周知,现在市面上几乎任何一款类型产品都有很多的竞品,所以核心功能以及特色的功能显得格外重要,这里我们队产品的功能的重要性做出分级(注意是产品的整体功能分级,而不是每一层信息的分级),此方法可以确定产品的核心功能和特色功能,比如IM产品微信,即时通信聊天是其核心功能,而抢红包功能就是其特色功能(虽然现在大都IM产品都可以抢红包了...)

同时,任何一款app都有其使用场景,是拥挤的公交地铁上,还是温暖舒适的床上,亦或是在喧嚣吵闹的大街上...充分的结合实际使用场景,同时考虑用户的使用习惯以及心智模型,将更加有助于我们理解产品。

在我们总结完产品的信息架构后,就要分析它的逻辑结构和布局了(注意,是布局不是UI)。关于逻辑结构,一方面我们要考虑产品功能的“层”和“度”,层太深,会增加用户的操作难度和学习成本;度太大,则会造成页面展示的信息过多,用户使用的同时会忽略一些功能。一般来说,产品某项操作流程的层不要超过五层,至于度,则要视产品的类型而定了。而关于页面布局,这是一个仁者见仁智者见智的问题,但理想情况下我们还是要秉承用户至上的原则(至于现实情况则要平衡商业利益),此处个人建议是站在客观的角度去欣赏评判,我们拆解分析的产品大多是经过市场考验及用户认可的,所以他们的设计师对此也是有很大的依据的。比如支付宝首页如豆腐块般摆放整齐却让人眼花缭乱的功能,但千千万的用户不也是用的不亦乐乎么,而你能说阿里的设计师水平很low么......

以上的种种只是拆解分析一款app的基础。同样的在当今时代,微交互也越来越被重视,在我看来也是一款产品的着重“加分项”,这一点上本人比较欣赏网易系的产品,交互上下足了功夫,用着很舒畅。举个栗子:国内当前很火的交友软件“探探”和网易众多小弟中的交友产品“花田”,里面都有一个翻牌子的功能,排除UGC质量的客观因素,当你长按用户卡片(图片)时,此刻“探探”中的用户卡片没有任何反应,而“花田”中的用户卡片却有个向下摆动的动效,模拟了现实中的情景。这种不惹眼的微交互会在无形中给用户以温暖的感觉,增加好感。

当在拆解一款产品时,虽然绝大多数时候我们是报着学习的态度,但同时应该有审视的眼光,任何一款产品都不是完美的,并不能满足所有的目标用户。所以在拆解的同时也要带着几个问题:

1.拿到产品后经过短时间的使用,能否知道这款产品的主要功能及特色功能;

2.体验一个核心功能的完整流程,过程是否遇到波折,体验是否流畅;

3.体验一个次要的但层级相对较深的功能,能否通过信息架构找到该功能。做到以上几点,说明产品的基本交互逻辑是OK的。

总结一下,要做的步骤就是:画信息架构图——分析功能重要级——页面结构布局分析——微交互分析——带着问题体验核心功能和次要功能。

最后想说的是,个人认为拆解一款app的目的性越强,最后的效果可能会越好,漫无目的的拆解,最终很可能是走马观花。

谢谢~

app设计信息架构图的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于APP信息结构图、app设计信息架构图的信息别忘了在本站进行查找喔。

扫码二维码