技术领域
[0001] 本
发明涉及移动APP原型设计技术领域,具体涉及移动APP快速原型演示的方法。
背景技术
[0002] 原型是需求确认和开发过程最重要的文档,是产品沟通的
桥梁。目前原型一般采用网页或者静态图片的方法,再加上一些动画效果。使用工具包括Axure, Pop等等。Axure可以生成Html原型,可以实现一些页面跳转和简单的动画,但由于操作不太直观,在实际使用过程中往往需要需要大量的文字来说明。Azure手机原型也是通过浏览器查看的,一般无法达到满意的效果。Pop快速手机原型通过
手指在图片上操作,从而建立页面之间的联系,但是由于只是图片界面之间的跳转,实现的功能和效果很有限。目前移动APP设计中原型无法与系统代码联系起来,有些与
硬件相关的功能无法通过原型表达(如控制无人机启飞),而只能通过代码调用相关功能,普通原型工具无法实现与业务代码的关联。
发明内容
[0003] 基于此,本发明提供一种移动APP快速原型演示的方法,使开发人员对需求更加明确,节省了开发时间;灵活性强,操作直观,可以实现多种功能;原型与实际业务互动,产生惊人的演示效果。
[0004] 为了实现本发明的目的,本发明采用以下技术方案:
[0005] 一种移动APP快速原型演示的方法,包括如下步骤:
[0006] S1、添加类库到APP程序中并添加依赖,然后将UI图片文件放入
指定文件夹,并按照预设
接口编写可以实现用户想要实现的功能的自定义代码,将该自定义代码添加到自定义动作库;
[0007] S2、用户启动原型设计界面,每个设计界面都显示一张或多张UI图片,用户在UI图片上长按在显示一个矩形框的响应区域;
[0008] S3、确认响应区域,跳转到一个功能选择界面,用户选择操作类型和响应类型;用户再次回到原型设计页面,在响应区域的
位置进行操作以触发响应动作;
[0009] S4、如还需添加其他自定义动作,则再次回到S2步骤;否则,原型设计完毕。
[0010] 在其中一些
实施例中,所述操作类型包单击、双击、长按以及滑动。
[0011] 在其中一些实施例中,所述响应类型包括跳转到一个原型页面、跳转到一个活动页、弹出一个对话框以及执行自定义动作。
[0012] 在其中一些实施例中,所述步骤S2中,通过拖动矩形框的中心或四
角以所述响应区域的大小。
[0013] 本发明还采用如下技术方案:
[0014] 一种移动APP快速原型演示的方法,其包括如下步骤:
[0015] S1、添加类库到APP程序中并添加依赖,并按照预设接口编写可以实现用户想要实现的功能的自定义代码,将该自定义代码添加到自定义动作库;
[0016] S2、用户启动原型设计界面,每个设计界面都显示一张或多张UI图片,将 UI图片文件放入指定文件夹,在UI图片上长按在显示一个矩形框的响应区域;
[0017] S3、确认响应区域,跳转到一个功能选择界面,用户选择操作类型和响应类型;用户再次回到原型设计页面,在响应区域的位置进行操作以触发响应动作;
[0018] S4、如还需添加其他自定义动作,则再次回到S2步骤;否则,原型设计完毕。
[0019] 本发明所述移动APP快速原型演示的方法,使用原型调用代码,在尽可能少地影响原有代码的
基础上对进行原型拓展,将原型和代码结合在一起,两者可以相互替换,方便进行对比,使开发人员对需求更加明确,节省了开发时间;除了代码接口需要开发者预先定义以外,其他的所有
修改操作都可以在手机上完成,用户可以随时对原型进行修改,灵活性强,操作直观,可以实现多种功能;利用原型可以在短时间内保证界面的完整性,然后开发实现一些关键功能,用户在使用原型的时候发现某些惊艳的功能居然是可以直接使用的,由此原型与实际业务互动,产生惊人的演示效果。
[0020] 原型默认是全屏显示图片,选择区域也是按照屏幕的百分比计算的,图片也可以按照不同
分辨率对应文件夹的方式存放,因此原型可以移植到不同尺寸的屏幕上的,兼容性强。
附图说明
[0021] 图1是本发明实施例所述移动APP快速原型演示的方法的
流程图;
[0022] 图2是本发明实施例所述移动APP快速原型演示的方法原型设计界面示意图;
[0023] 图3是本发明实施例所述移动APP快速原型演示的方法页面跳转动作编辑的示意图;
[0024] 图4是本发明实.施例所述移动APP快速原型演示的方法执行自定义动作的示意图;
[0025] 图5是本发明实.施例所述移动APP快速原型演示的方法界面图片文件被放入在主程序的assets文件夹下的示意图。
具体实施方式
[0026] 为了便于理解本发明,下面将结合附图对本发明进行更全面的描述。附图中给出了本发明的较佳实施例。但是,本发明可以以许多不同的形式来实现,并不限于本文所描述的实施例。相反地,提供这些实施例的目的是使对本发明的公开内容的理解更加透彻全面。
[0027] 需要说明的是,当元件被称为“固定于”另一个元件,它可以直接在另一个元件上或者也可以存在居中的元件。当一个元件被认为是“连接”另一个元件,它可以是直接连接到另一个元件或者可能同时存在居中元件。
[0028] 除非另有定义,本文所使用的所有的技术和科学术语与属于本发明的技术领域的技术人员通常理解的含义相同。本文中在本发明的
说明书中所使用的术语只是为了描述具体的实施例的目的,不是旨在于限制本发明。
[0029] 实施例
[0030] 请参照图1,本发明所述的移动APP快速原型演示的方法,包括如下步骤:
[0031] S1、添加类库到APP程序中并添加依赖,然后将UI图片文件放入指定文件夹,并按照预设接口编写可以实现用户想要实现的功能的自定义代码,将该自定义代码添加到自定义动作库;
[0032] S2、用户启动原型设计界面,每个设计界面都显示一张或多张UI图片,用户在UI图片上长按在显示一个矩形框的响应区域;通过拖动矩形框的中心或四角以所述响应区域的大小。
[0033] S3、确认响应区域,跳转到一个功能选择界面,用户选择操作类型和响应类型;用户再次回到原型设计页面,在响应区域的位置进行操作以触发响应动作;
[0034] S4、如还需添加其他自定义动作,则再次回到S2步骤;否则,原型设计完毕。
[0035] 其中,所述的操作类型包单击、双击、长按以及滑动。所述响应类型包括跳转到一个原型页面、跳转到一个活动页、弹出一个对话框以及执行自定义动作。
[0036] 或,本发明还采用如下技术方案,在程序运行后添加UI图片文件:
[0037] 一种移动APP快速原型演示的方法,其包括如下步骤:
[0038] S1、添加类库到APP程序中并添加依赖,并按照预设接口编写可以实现用户想要实现的功能的自定义代码,将该自定义代码添加到自定义动作库;
[0039] S2、用户启动原型设计界面,每个设计界面都显示一张或多张UI图片,将 UI图片文件放入指定文件夹,在UI图片上长按在显示一个矩形框的响应区域;
[0040] S3、确认响应区域,跳转到一个功能选择界面,用户选择操作类型和响应类型;用户再次回到原型设计页面,在响应区域的位置进行操作以触发响应动作;
[0041] S4、如还需添加其他自定义动作,则再次回到S2步骤;否则,原型设计完毕。
[0042] 本发明所述的方案具体如下:
[0043] 请参照图1,本方案通过类库的方式实现,用户的主程序需要先添加本类库到项目中并添加依赖,然后将UI界面图片文件放入指定文件夹(也可以程序运行后添加)。
[0044] 用户可以在包含在主程序合适位置启动原型设计界面,每个设计界面都显示一张UI或多张图片,用户可以通过在UI图片上长按在该位置显示一个矩形框的响应区域,用户可以通过拖动矩形框中心或四角来改变该区域的大小,确认响应区域后,跳转到一个功能选择界面,在这个界面,用户可以选择操作类型和响应类型,其中操作类型包单击、双击、长按、滑动等等,操作响应包括跳转到一个原型页面、跳转到一个活动页,弹出一个对话框或者执行自定义动作等等。自定义动作是用户按照一定接口编写的一段代码,然后添加到自定义动作库,自定义动作可以实现用户想要的任何功能。定义好操作之后,当用户再次回到原型设计页面,在相应位置进行操作便可触发响应动作。同一个位置可以响应多种不同类型的操作,如可以在一个按纽的位置上同时添加点击和下拉的动作。
[0045] 以下将通过举例来说明本发明所述的方案:
[0046] 本案通过类库(封装用于进行二次的开发API)的方式实现,用户的主程序需要先添加本类库到项目中并添加依赖,然后将UI界面图片文件放入指定文件夹(也可以程序运行后添加)。其中,本案中所实现的库为prototype,用来实现原型的功能,它被主程序所依赖。DJI-SDK-LIB用来连接与控制无人机。界面图片文件被放入在主程序的assets文件夹下,参照图5所示。
[0047] 参照图2,成功运行项目后,然后用户就可以在程序合适位置启动原型设计界面,每个设计界面都显示一张UI或多张图片,用户可以通过在UI图片上长按在该位置显示一个矩形框来表示响应区域,用户可以通过拖动矩形框中心或四角来改变该区域的大小。已经添加过动作的响应区域
叠加了一层背景色进行区分。
[0048] 参照图3,确认响应区域后,跳转到一个功能选择界面,在这个界面,用户可以选择操作类型和响应类型,其中操作类型包单击、双击、长按、滑动等等,操作响应包括跳转到一个原型页面、跳转到一个活动页。在界面的工具栏中间可以选择操作类型,打开返回上级
开关则执行返回操作,打开新的Activity表示跳转新的活动页,否则直接在当前活动页进行图片替换。
[0049] 参照图4,除进行页面跳转之外,还可以弹出一个对话框或者执行自定义动作等等。自定义动作是用户按照一定接口编写的一段代码,然后添加到自定义动作库,自定义动作可以实现用户想要的任何功能。定义好操作之后,当用户再次回到原型设计页面,在相应位置进行操作便可触发响应动作,例如用户后滑通过自定义的动作启动无人机。同一个位置可以响应多种不同类型的操作,如可以在一个按纽的位置上同时添加点击和下拉的动作。
[0050] 本发明所述移动APP快速原型演示的方法,使用原型调用代码,在尽可能少地影响原有代码的基础上对进行原型拓展,将原型和代码结合在一起,具有如下的效果:
[0051] 1、帮助明确开发需求,节省开发时间。将原型和代码结合在一起,两者可以相互替换,方便进行对比,使开发人员对需求更加明确。
[0052] 2、
用户界面的设计。提供丰富多样的内置页面、页面组件和常用的代码接口,方便用户可以快速开发出产品原型。常见的内置页面包括注册登录界面、个人信息界面等等;页面组件包括列表,对话框等等;常用的代码接口包括打开网页,分享到朋友圈等等,帮助明确开发需求,节省开发时间。将原型和代码结合在一起,两者可以相互替换,方便进行对比,使开发人员对需求更加明确。
[0053] 3、制做简单,灵活性强。除了代码接口需要开发者预先定义以外,其他的所有修改操作都可以在手机上完成,用户可以随时对原型进行修改。
[0054] 4、兼容性强,原型默认是全屏显示图片,选择区域也是按照屏幕的百分比计算的,图片也可以按照不同分辨率对应文件夹的方式存放,因此原型是可以移植到不同尺寸的屏幕上的。
[0055] 5、原型与实际业务互动,产生惊人的演示效果。首先利用原型可以在短时间内保证界面的完整性,然后开发实现一些关键功能。用户在使用原型的时候发现某些惊艳的功能居然是可以直接使用的,达到意想不到的效果。
[0056] 以上所述实施例仅表达了本发明的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对本发明
专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本发明构思的前提下,还可以做出若干
变形和改进,这些都属于本发明的保护范围。因此,本发明专利的保护范围应以所附
权利要求为准。