主页 > 其它问答 > > (app交互怎么做)APP怎么做
最佳回答 最佳答案

本回答由网友推荐

空心人

创建属于自己的元件库原型制作工具的核心功能无非就是通过元件的堆砌组合,来展示产品的目标形态和效果。
Axure自带的只是一些最基本的元件,而网上的元件库庞杂混乱,很难找到满足需求并且称心的元件,并且大部分都是位图格式,根本无法修改颜色宽度等数值,制作出来的交互又怎么能达到精美的水准要求呢?还好Axure提供了「创建部件库」的功能,能够支持我们制作一份属于自己的元件库。
我们可以通过软件自带的基本元件搭配组合出我们常用的图标、控件,制作完成后,每次应用的时候还能根据实际情况调整颜色、大小、线宽的数值,从而才能实现交互稿统一完美的风格。
比如,APP中经常会用到一些主页、分享、搜索、消息各种图标,或者我们每次遇到喜欢的图标,都可以用Axure画出来,以备不时之需。
下边以图标为例讲一下制作元件库的具体步骤。
一、创建元件库“绿色文件”打开Axure,在元件库面板「三条横线」按钮下拉选项中找到「创建部件库」功能,点击会弹出一个另存为对话框,这里需要选择元件库文件的存储位置,并需要输入元件库的名称。
此时,我们可以看到,文件的后缀名为rplib,这个就是元件库的格式,而不同于创作交互原型时正常Axure文件的rp格式。
输入文件名称和存储位置之后,点击保存,Axure将重新打开一个新页面进行元件的编辑。
并且我们可以看到,新页面跟我们平时创造rp正常文件的页面一模一样,但不要混淆,此时页面编辑的是我们在正常rp文件中需要用的基本元件。
并且我们回到元件库存储的位置可以看到,元件库rplib文件图标为”绿色“,不同于rp文件的蓝色。
创建好元件库得”绿色文件“后,基本准备工作已经做完,下边就进入到制作过程。
二、元件库分组通过观察Axure默认的元件库,我们可以看到其元件库是可以按照类别进行分组的。
比如默认的分成了:
common、forms、flow等等,这样能更方便我们找到目标元件的位置。
同样,我们在制作元件库的时候,也可以进行分组,规则为:
在页面导航面板上,所有的文件夹都是一个分组,所有没有在文件夹下的页面包括其所有子页面,都隶属与以元件库为名的分组下。
分组的规则弄明白之后,我们可以先按照自己对元件库的规划进行一个合理的分组,比如要做APP的元件库,那么我们可以分成:
图标、控件、框架3个常用分组,接下来就进入到具体元件的制作过程。
三、编辑并制作元件我们以制作一个”我的“头像图标为例,首先在图标分组下,添加一个页面并命名为”我的“,双击进入到元件编辑页面,编辑操作就跟我们平时制作正常的rp文件一模一样。
我们我们可以参考一些app中常常采用的”我的“图标样式,然后用Axure默认的基本形状元件,比如矩形、横线、圆形等,组合拼凑成最终比较理想的样子。
首先我们要明确,Axure中没有类似PS中的布尔运算(能够自由的对多个形状进行编辑,比如合并、相交、减去顶层等),所以会给我们制作元件,尤其是图标带来一定局限性,但好在交互原型并不要求苛刻的细节实现,只要我们能够很清楚的表示出产品形态,有比较整体的风格就可以了。
并且我们用Axure基本形状自己勾画出来的图标,能很方便的调整颜色大小等,可以适用不同的交互文件,这就是从网上找现成的位图图标很难达到的便利性。
回到“我的”图标制作,如图所示,我一共用到了三个基本形状来进行拼凑,最终组合成了我们经常能看到的一个图标样式,并且一眼就能明白它的含义。
虽然没有更多的细节实现,但对于交互原型稿来说已经完全够用,关键是颜色大小等可以很灵活的进行修改。
按照这个思路,我们可以制作更多的图标出来,当然还可以制作一些常用控件比如按钮、appbar、搜索栏、图标占位符等等。
如下图,是我在画「读读日报」原型图时制作的一个元件库:
元件库制作完成之后,然后就进入到最后一个步骤。
四、载入自制元件库并使用元件库制作完成保存在自己常用的资源文件夹中。
打开一个正常的rp文件,同样是在元件库面板「三条横线」按钮下拉选项中找到「载入部件库」功能,然后找到制作完成的元件库文件“绿色图标”载入。
载入之后,我们就可以在「选择元件库」下拉选项中,找到刚刚载入的元件库并选中,然后我们就可以像使用软件自带的元件一样使用我们自制的元件库了。
怎么样,看到这里你应该学会了如何自制一个元件库了吧,希望你会花时间动手做一个。
当然除了创建部件库,Axure有很多技巧都需要掌握,比如母版的功能。
学会善用母版在产品的设计过程中,主导航往往出现在多个页面,比如APP的底部tab栏。
当然不仅仅是导航,当我们频繁使用任何一组控件的时候,希望你不是一直都在复制和粘贴,永远记住,创建一个母版可能是更好的选择。
使用母版的便利性不单单体现在能够快速的使用一组控件,尤其是在设计后期,当我们需要修改某些基本控件的时候,母版带来的修改效率一定会让你深深的爱上这个功能,欲罢不能。
除了学会使用母版,更要学会善用母版。
同样有一点希望能记住,不要把太大的组合对象变成母版。
因为越是大的组合对象,越是有可能需要在母版的很多地方做出修改。
此时把一些母版和另外一个母版合并起来一般会是更好的办法,这样对母版的修改会更加的灵活,比如下图,将产品基本信息和可能购买状态分开成两个母版,组合在一起成为产品的完整页面制定一套自己的交互风格学会了创建自己的元件库,也懂得了善用母版,当然还有其他很多Axure软件的使用技巧。
应该就可以很快速的完成一份交互原型稿了吧,可是又该如何保证交付稿有统一的风格,达到较高的目标水准呢?首先,我们要熟悉APP的设计规范,符合Android或者iOS的设计理念,对于一些常规的控件设计规则有一定的了解。
这样设计出来的产品才能符合这个平台的特性,并且基于大家对相关平台的一些固有认知,很容易能够达成共识。
这也是交互原型作为一个沟通交付物应该达成的目标。
基于对APP设计规范的熟悉,同时在制作过程中,要根据使用场景以及自己的习惯来制定一套自己的交互风格。
比如可以定义好APP原型中,正文字体采用微软雅黑颜色#33333313字号、提示文字为微软雅黑颜色#99999910字号、固定的appbar行高为40px,内容据左侧屏幕边缘10px距离当然某些规范,比如字体也可以当成一个字体元件,放到我们自制的元件库中,总之要根据自己的情况灵活的运用。
有了一套风格之后,加上创建的元件库随意修改颜色大小等,我相信制作出来的交互原型肯定是协调统一的整体。
读读日报原型制作理论方法掌握了,需要实践的锻炼才能更好的吸收领悟。
我参照「读读日报」iOS版,对主要的一些页面画了一些交互原型。
基本过程和思路就是按照本文所提到的这些内容。
为了更有形象感,从网上找来一个iPhone手机的边框,并且创建自己的部件库,绘制了一些常用的图标和控件。
然后设定了整体的风格,制作过程中也用到了几个母版提高效率,同时可以使用辅助线帮助自己保证部件的对齐、平均分布等,进而提高布局的美感。
总结末尾再次抛出我开篇提到的,如何用Axure快速制作APP交互原型的方法论:
制作属于自己的元件库并要学会善用母版,熟悉APP设计规范并要有自己一套交互风格样式。

赞同 (7347)

反对 (564)

其它回答
家国恩仇记

基本上每个人都有自己成长的不同路径,不同方法,找到属于自己的那条路是最重要的。
专业上的提升,其实我觉得不是问题,其他的答案也都写得比较多。
非常多的人入行后会关注“交互设计”前面的“交互”,却容易忽略后面的“设计”。
空闲时阅读一下《设计中的设计》之类设计思考的书;
我在工作了很久之后才反思到这点(就是因为对设计的理解不深)。
设计原本就是为人服务的,而交互设计尤其强调“交互”的过程。
要学习不只关注产品,还要关注人。
你可以不懂用户研究的所有事情和知识,但一定要有所了解,至少不要误用他们的报告。
3提升自己的品位,对美的感受力品位有多重要?看看Jobs和Gates的差别就知道了。
不要忽略设计专业出身的人的优势:
对美的鉴别和感受能力,这会影响一个人的品位。
许多非设计专业的人因为接触相对较少,也没有经过系统的训练,在感受力和鉴别力方面会显得比较弱。
表现在设计中就是缺乏美感。
大量的去看、去接触、去感受那些美好的东西。
不只产品,所有艺术相关的事物都应该接触;
看展览是非常好的事情,能和一个设计专业的朋友一起去就更好了;
有兴趣的话,可以学习摄影。
很多人觉得读书没有用,非常理论,无法实际运用……对于新人来说的确是这样的。
但是,非科班出身的人面对的一个非常大的挑战,就是缺乏完整的知识和思维体系。
多读书,了解不同的设计思维体系,建立自己的思维体系;
类似《Don’tMakeMeThink》,你也会发现它是按照Web开发过程来写的:
认知心理-设计原则-内容-导航-细节-用户测试-开发作为设计师,其实是应该读更多不同专业的书的…5尽可能地扩展知识面AnarchitectknowssomethingabouteverythingAnengineerknowseverythingaboutonething——《101ThingsILearnedinArchitectureSchool》尤其是在互联网产品设计流程中,现在的交互设计师扮演了一个承上启下的关键角色。
了解和你工作流程相关的所有事情,无论多远;
接触在不同设计领域工作的人。
在知乎上有非常多的关于成长和学习的好问题,可以搜索一下。
列几条我知道的可能有帮助的问题供参考,想到了再补充吧:
新手交互设计师需要关注几个点:
app本身的规范,熟读并能够看出来app本身哪里有没有不符合规范的地方。
拆解掉这个优秀app所有的功能及体验流程,思考每一步,及为什么。
最好是找这个app的设计师,邮件请教他这里是如何思考的。
1界面截图or录屏。
把app整体的玩一遍,过程中截图留档。
如果是对手势支持较多或者动效较多的会录屏留档。
2页面sitemapapp里不宜层级过深,把截图整理后「同页面不同状态可以合并」还原一下sitemap。
看看别人如何组织自己的结构。
3流程重现还是利用前面的截图,在画图工具里自己串一下。
这里就可以发现这些优秀apps对于自己设计规范的定义。
比如对于某操作,什么时候使用浮层,什么时候使用页面。
4竞品分析有对比才能看出设计差异和设计理念。
找到同类型的优秀应用。
看看每一个产品、设计上的不同处理。
你就会发现其中真正的差异。
5保持使用如果你觉得他真的不错,记得要时常用一下。
因为我们不可能在一次使用中就能发现其中的每一个设计环节。
如果是社交类的应用,最好找几个有同样兴趣的同学平常一起来做测试。

赞同 (44677)

反对 (696)

一个娇宠儿

app交互设计分为以下5种:
1树形结构,做产品交互的逻辑关系就要像自然生长的大树,树干、树枝和树叶越往内部交互就要越少,不能在树叶上长了颗大树。
通常情况下很容易理解,交互设计与功能复杂度相联系,就像大树一样,界面展示一开始的时候是树根树干树枝和一片小树叶,功能点一点点变小,减弱。
但是有时候我们在用app的时候会在一个很不明显的地方有一个大功能,就像发现新大陆一样,我不说这个对还是错,如果这个新大陆是一个很重要的功能点,那么做交互就要有新手引导,指引用户用这个功能,不然只有20%的用户会发现此功能,埋藏越深责用户点击率会越低。
如果这个功能不是很重要那么可不可以换一种形式展现,减少功能点从一棵树变成一片树叶。
2大众交互,为了追求不一样而硬要改变的同时要做好新手引导。
交互的复杂多变会让用户摸不着头脑,一半用户学会这个功能需要交“学费”,要做到市面上最普遍的形式,不要因为不一样而变的不一样,如果非得要变就要把它变好,要好新手指引,不然改变了用户习惯,给那些“小白”用户造成困惑,甚至是流失很多潜在付费用户。
3错觉交互,利用人性的弱点扩大产品收入。
错觉交互是利用人们最正常的用户习惯来做一些用户不想做的事情,达到研发商的目的,通常利用这种情况最多的是付费,无意间骗取用户钱财,很多用户不会在意1元两元的费用打电话投诉或索要,就造成了很多研发商一款上线的产品会有大几百万的流水。
4深度交互深度交互就是人机器界面又增加了机器的交互,比如:很多唱歌的app,当你录制歌曲的时候利用自带的耳机录制音乐效果会很差,不会让歌手发挥更好就自己研究了一款麦克风,用手机这款app要配合一款外接一款机器才能达到最理想的效果5本质交互“顾客是上帝”一定要分析用户。
每个项目的实用性和交互性不是在给某一个老板或者哪个制作人用,不能按照他们的想法做出他们喜欢的东西,是给用户用。
老板们用多年来的经验和阅历为依据在做事情,请不要忘记你的思想掌控不了用户,用户的思想你要研究甚至成为你的用户,不然总认为自己是金字塔上最高的人,指挥跟你混的人民战斗,不深入了解用户你指挥的永远是外走内不走,行尸走肉一般刷的吗

赞同 (83952)

反对 (559)

我的擦伤

app交互设计分为以下5种:
1树形结构,做产品交互的逻辑关系就要像自然生长的大树,树干、树枝和树叶越往内部交互就要越少,不能在树叶上长了颗大树。
通常情况下很容易理解,交互设计与功能复杂度相联系,就像大树一样,界面展示一开始的时候是树根树干树枝和一片小树叶,功能点一点点变小,减弱。
但是有时候我们在用app的时候会在一个很不明显的地方有一个大功能,就像发现新大陆一样,我不说这个对还是错,如果这个新大陆是一个很重要的功能点,那么做交互就要有新手引导,指引用户用这个功能,不然只有20%的用户会发现此功能,埋藏越深责用户点击率会越低。
如果这个功能不是很重要那么可不可以换一种形式展现,减少功能点从一棵树变成一片树叶。
2大众交互,为了追求不一样而硬要改变的同时要做好新手引导。
交互的复杂多变会让用户摸不着头脑,一半用户学会这个功能需要交“学费”,要做到市面上最普遍的形式,不要因为不一样而变的不一样,如果非得要变就要把它变好,要好新手指引,不然改变了用户习惯,给那些“小白”用户造成困惑,甚至是流失很多潜在付费用户。
3错觉交互,利用人性的弱点扩大产品收入。
错觉交互是利用人们最正常的用户习惯来做一些用户不想做的事情,达到研发商的目的,通常利用这种情况最多的是付费,无意间骗取用户钱财,很多用户不会在意1元两元的费用打电话投诉或索要,就造成了很多研发商一款上线的产品会有大几百万的流水。
4深度交互深度交互就是人机器界面又增加了机器的交互,比如:很多唱歌的app,当你录制歌曲的时候利用自带的耳机录制音乐效果会很差,不会让歌手发挥更好就自己研究了一款麦克风,用手机这款app要配合一款外接一款机器才能达到最理想的效果5本质交互“顾客是上帝”一定要分析用户。
每个项目的实用性和交互性不是在给某一个老板或者哪个制作人用,不能按照他们的想法做出他们喜欢的东西,是给用户用。
老板们用多年来的经验和阅历为依据在做事情,请不要忘记你的思想掌控不了用户,用户的思想你要研究甚至成为你的用户,不然总认为自己是金字塔上最高的人,指挥跟你混的人民战斗,不深入了解用户你指挥的永远是外走内不走,行尸走肉一般

赞同 (58530)

反对 (173)

麻衣神算子

说到精细视差效果的APP应用,就是指让APP应用的多层背景以不同的速度移动,并形成立体的运动效果,APP应用设计时使用视差效果,可以为用户带来非常出色的感官体验。
在许多的APP应用中,设计师们喜欢在APP应用软件的新手引导页使用视差效果,可以让用户看到的时候产生眼前一亮的感觉,加深用户对这个APP应用的第一印象。
还有就是,精细的视差效果的APP应用设计也可以给用户带来错落有致的新鲜体验。
信息框架扁平化设计的APP应用说到APP应用信息框架的扁平化设计,可以说是近几年比较热门的交互设计模式之一,扁平化的APP应用设计注重通过弱化视觉效果来强化功能主义。
通过从信息架构的角度去应用扁平化设计理念,用以减少APP应用当中的信息层级,从而缩短信息到达用户的距离,使用户能够更加快速便捷的通过APP应用获取到自己所需要的信息。
如此这般,便能大大缩短用户获取信息的等待和操作的时间,提高用户对于APP应用的好感度。
设计使用转场动效的APP应用APP应用的转场动效设计也是众多APP应用设计师经常使用的模式,不过这里要说的并不是传统的滑动、放大缩小等转场动效,而是平滑的APP应用设计。
平滑无缝的切换和体验,信息需要没有阻力的传递。
这是由于用户在浏览时,都需要集中精力,专注于目标任务来对APP应用进行一系列的操作。
因此,优先注重极致平滑转场动效的APP应用,在面对众多强大的同行时,往往会具备更大的竞争力。
相信通过以上三个方面,可以在大家做APP应用的交互性设计时,能够带来更多的设计灵感和素材,并合理的运用到自己的APP应用当中,只有这样,才能设计出真正令用户好感和喜欢的,体验效果绝佳和优质的,能够取得最终胜利的,为企业实现盈利的APP应用来。
否则的话,即便是APP应用拥有再好的创意,再好的质量,不能让用户产生好印象,也就无法获得用户喜爱,而失去用户支持的APP应用,即便穷其一生也是无法取得成功的。

赞同 (8591)

反对 (185)

画扇悲风殇月夜

当你历尽千辛万苦让用户来到你的网站,那么下一个重要举措就是把他们转化成你的潜在客户。
相信每个内行的市场营销人员都深知这一点。
那么最好的方法是怎样的呢?答案只有一个,就是做一个能抓住用户的优质登陆页面!现在你已经做好了移动App。
它创意十足,直观实用,你非常确定这是同类应用中最好的App,接下来你要做的就是让人们装上你的App。
那么你就要做广告。
你一定不想直接把广告链接到应用商店页面,没错,这主意糟透了你造吗。
你需要的是在登陆页面上引导访客根据自己的移动设备(苹果,安卓,或者微软)去商店来选择适用自己的应用。
你必须让你的登陆页面尽可能的引人注目,不然怎么能让他们从访客变成客户呢。
下面我们收集了20个最受欢迎的移动app登陆页面。
我们根据关键词将这些页面分为如下几类。
一、简洁为佳早在几年前,网页设计者们就发现,网站内容越多,就越会让用户觉得迷茫,进而把用户吓跑。
所以我们常常能看到一些卡通的,简单的,流线型的网站页面和App。
这个趋势还在发展,并且势头不断增大。
与其在网站上集结各种各样分散注意力的元素,你还不如集中在一个要点上。
下面的App非常复杂有创意,但是它们的登陆页面简单集中。
这就是它们引人瞩目的原因。
Loudie这个例子完美的展示了重点突出的登陆页面应该有的样子。
一段式的文字,以简洁精确的方式介绍了这个App的用途。
大家还可以注意一下图片中的社交媒体,Facebook和Twitter的图标以非常谨慎的方式出现。
这完全就是我们所谈到的专注的简约主义。
ZonkOut这是另外一个简单集中的app登陆页面。
这种垂直分隔页面的方式视觉效果很好,实现了突出app本身和其功能性的完美结合。
灰黑的主色,搭配几处红色两点,让整个页面看上去有序专业。
这绝对是最酷炫的小型登陆页面之一。
你可以试试应用之星网站,可以设置动画效果来控制,交互可以用交互控件来设置

赞同 (16582)

反对 (813)

小殿下

h5前端就是html5开发的前端交互设计是一个过程,它不仅仅是画线框图。
交互设计最关键的两个环节是页面流程和页面布局,前者建立清晰的架构和严密的逻辑,后者整合零散的信息并确定分明的主次关系。
这一切都是为了我们的终极目标——让我们的界面符合用户的预期,不带给他们任何的意外。
一切都在用户的意料之中。
我们使用Javascript技术以及jQuery库和Ajax控制页面的交互行为、动画效果等,使网站更具友好性和亲和力,跟踪产品的体验效果数据,关注用户,持续改善产品的用户体验。
div+css:是WEB设计标准,它是一种网页的布局方法。
与传统中通过表格(table)布局定位的方式不同,它可以实现网页页面内容与表现相分离。
app:就是Application应用程序,多指移动端的pc级移动端我个人理解就是尽量解决移动和pc端的使用差异,让pc手机访问都是一个效果js效果是利用javascript脚本语言操作dom,来做出绚丽的动画效果,替代了flash。
以上有1个是网上搜的,剩下全是个人理解首先gif格式的动画是交互不了的。
其次,做flash还是用flash软件好,ae做出来的尺寸太大!

赞同 (23026)

反对 (232)

波克斗地主

问题:是先用axure做出APP所有界面的交互和框架,再到ps去美化完善界面,最后进行切图标注吗?还是先在ps把界面都完成,切图标注后再到axure做交互?
先讨论APP的功能,出思维逻辑图,然后根据思维图出原型图,确定了用ps做效果图,然后是标注切图交互界面说白了就是你操作的界面,只不过交互界面是比较专业的叫法,软件行业内部的专业名称,用户没有必要关系它的叫法,就是你看到的操作界面。
交互界面是人和计算机进行信息交换的通道,用户通过交互界面面向计算机输入信息、进行操作,计算机则通过交互界面向用户提供信息,以供阅读、分析和判断。

赞同 (47494)

反对 (157)

星際探險家

其实还是能做到的,我这么干过,步骤1安装2013版office2熟悉操作,尤其是基本动画设计和合并形状(推荐秋叶PPT三分钟教程,有免费电子版哦,认真做完每一期三分钟就差不多了)以上两点就够了keynote和ppt都是幻灯片制作和演示软件,大多数功能都可以实现,只不过是操作步骤的多少的区别。

赞同 (59810)

反对 (693)

众星之子

交互方式有很多,根据你们服务器,客户端的需求来选择就可以。
比如,xml,字符串,json。
都是可以的,xml,json都是比较常用的。
查看原帖>>

赞同 (56551)

反对 (390)

孬崽!

得用到很多东西首页得设计师设计交互效果然后由你来实现,用到很多插件,还有css,css3的animatetransformtransition

赞同 (45419)

反对 (394)

摘星月

建议做手机交互,因为手机行业现在发展速度非常快,人才稍微少一些,比较有前途!
网页设计已经好多年了,人才已经有不少了,现在开始学习并不具有优势!

赞同 (17944)

反对 (974)

袖里藏风

首先GIF格式的动画是交互不了的。
其次,做flash还是用flash软件好,ae做出来的尺寸太大!

赞同 (84812)

反对 (149)

相关百科

(哥斯拉玩具怎么做)怎么制作幼儿园自制玩具

在昆明市,西昌路680号,22分部旁一个不显眼的小店,也就是大观商业城后门往新闻路方向,部队旁边.,我在卖这玩具的旁边上班,相信我没错....全文

等你回答

换一换