zoukankan      html  css  js  c++  java
  • Indesign多媒体富交互插件【MagBuilder】与iOS app 【MagViewer】介绍

    【写在前面】进园子有一段时间了,从来都是看别人的文章,自己的一点东西都记在本地笔记里,现在想把一些东西拿来出分享,希望能够认识一些志同道合的朋友和老师。
    学习Adobe插件开发的初衷是为了给PS做插件来简化工作流程,也做了一些小工具在内部使用,但是感觉Adobe公司对插件开发虽然提供了平台和接口,维护的却不到位,论坛冷冷清清,接口也是各种小bug,处处制肘,因此比较难以做出好的东西,当时做的是一款多终端实时预览的插件【P2HViewer】,有机会再做介绍。

    MagBuilder

    MagBuilder是为了解决工作中遇到的实际的问题而制作的,它是为了简化工作流程而开发的。与多媒体电子杂志打交道的朋友们可能对Indesign并不陌生,它是一款专注于排版的Adobe软件,后来Adobe官方推出其交互制作插件DPS,就是在其基础上增加了交互制作,有了排版和交互信息,电子杂志就应运而生了。
    但是DPS有一些缺点:
    1、交互较少,很多交互还是依靠原始暴力的序列图来实现
    2、收费,且不菲
    3、要预览交互实际效果,需要上传到Adobe的云服务器再用DPS配套客户端查看
    因此,开发了【MagBuilder】这款插件(安装包见文末),它增加了更多的交互,也实现了更多的效果,同时它支持实时预览,只需要用【MagViewer】扫描其生成的二维码就可以查看实际效果,还可以在本地导出杂志包,在网络不理想的情况下还可以通过数据线将杂志包手动导入app并查看。

    MagBuilder只支持Indesign 9.1以上版本

    界面及功能

    在安装了插件之后,在Indesign的【窗口-》扩展功能】菜单下就可以找到MagBuilder,其主界面如下:

    MagBuilder的所有交互都是基于Indesign原生按钮及原生多状态对象的,因此在没有选中多状态对象的时候,界面是锁定的,当选定某个多状态对象(非其某一状态)的时候,界面会解锁,此时如果该对象还未创建交互,则可创建新交互,如果已经创建了交互,则显示该交互的具体信息。如下图:

    其中大部分属性较为易懂,【联动对象】是用来创建页面内联动效果的属性,比如多个PPT联动或者按钮和PPT联动等等,点击【联动对象】的时候会显示当前页面内其他已经创建的交互列表,选择之后则这些联动之间就产生联动效果。__特别地,按钮和超链接的创建依旧是Indesign原生按钮的创建方式,包括其交互(如指向的多状态对象或者跳转页面等等)都保持原样。__

    创建交互完成之后,切换到第二个tab,点击【预览】,在短暂的生成杂志过程之后,就会在第二个tab生成一个二维码,用【MagBuilder】扫描该二维码,如果手机和电脑是完全在同一个网络环境中的,则可在手机端直接看到整本杂志的实际效果

    第三个tab主要是导入导出功能,导入是指在指定位置导入已经制作好的html页面,在某个Indesign page上创建一个矩形,选中该矩形,然后选择导入一个页面,则在最后的杂志包中,该html文件会代替矩形所在的页面出现在产出包中。
    导出功能,则是导出杂志包到指定位置,这个杂志包主要是用来通过数据线将其导入到【MagViewer】中预览效果,如果勾选高清包,则会同时导出两倍尺寸的高清版本。

    在界面的底部有一个刷新按钮,当在某些情况下面板可能会持续锁定或者丢失交互信息,此时可点击该按钮以刷新面板,这是由于Adobe插件接口本身的bug导致的。

    MagViewer

    有了MagBuilder可以做出富交互的杂志,但是还缺乏一个可以直观实时预览的工具以在上线杂志之前进行预览和排错,因此我又开发了一个配合使用的ios app--MagViewer,它能够使设计师在使用MagBuilder制作精彩多媒体杂志的同时,快捷及时地预览杂志的交互效果,它提供多种方式预览杂志,包括直接扫描MagBuilder生成的二维码预览每一页杂志、扫描MagBuilder二维码将杂志包下载进APP进行预览以及通过iTunes文件分享功能将MagBuilder导出的.mag格式文件导入APP阅读:将移动设备与MAC连接,在itunes中选择移动设备的【应用程序->文件共享->Magviewer】,将.mag文件拖拽进【"MagViewer的文稿"】栏目下,然后在移动设备上点击Magviewer的【同步预览】,即可将该杂志包同步到手机app中浏览。
    Magviewer的具体情况和使用说明参见Appstore Magviewer的截图和说明。

    下载地址

    MagViewer :https://itunes.apple.com/cn/app/magviewer/id950166117?mt=8
    MagBuilder:http://files.cnblogs.com/files/dson/MagBuilder.zxp.zip

    交流

    如果您对这一类技术也比较感兴趣,欢迎评论讨论,也欢迎联系我。

  • 相关阅读:
    kernel 于ioctl申请书
    顺时针打印矩阵
    HDU 1557 权利指数 国家压缩 暴力
    从混沌到有序--熵
    分层思想总结
    什么是分层架构模式
    分层设计
    分层设计思想
    软件的生长方式
    设计模式、SOLID原则:组件与联系
  • 原文地址:https://www.cnblogs.com/dson/p/4323028.html
Copyright © 2011-2022 走看看