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
交流
如果您对这一类技术也比较感兴趣,欢迎评论讨论,也欢迎联系我。
Indesign多媒体富交互插件【MagBuilder】与iOS app 【MagViewer】介绍的更多相关文章
- 小程序快速部署富文本插件wxParser
为了解决html2wxml在ios下字体过大问题,又发现一个比较好用的富文本插件:wxParser. 目前 wxParser 支持对一般的富文本内容包括标题.字体大小.对齐和列表等进行解析.同时也支持 ...
- 10 个基于 jQuery 的 Web 交互插件推荐
英文原文:10 jQuery for Web Interaction Plugins “用户交互”在现代的 Web 设计中占据了很大比例,这是互联网产品不可或缺的关键,对 Web 设计师也提出了更高的 ...
- Xamarin.iOS - 利用Settings插件与EAIntroView制作App的欢迎界面
Xamarin.iOS - 利用Settings插件与EAIntroView制作App的欢迎界面 关于欢迎界面 很多App第一次启动都会有一个欢迎界面,欢迎界面往往决定这用户对App的第一映像,所以欢 ...
- 【富文本、JS】将接口传来的全部纯URL替换为富文本插件能识别到的img标签
replaceURLWithImage (text) { var a = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0 ...
- GitHub上排名前100的iOS开源库介绍(来自github)
主要对当前 GitHub 排名前 100 的项目做一个简单的简介,方便初学者快速了解到当前 Objective-C 在 GitHub 的情况. 若有任何疑问可通过微博@李锦发联系我 项目名称 项目信息 ...
- 用Model-View-ViewModel构建iOS App(转)
转载自 Model-View-ViewModel for iOS [译] 如果你已经开发一段时间的iOS应用,你一定听说过Model-View-Controller, 即MVC.MVC是构建iOS a ...
- 用Model-View-ViewModel构建iOS App
如果你已经开发一段时间的iOS应用,你一定听说过Model-View-Controller,即MVC.MVC是构建iOS App的标准模式.然而,最近我已经越来越厌倦MVC的一些缺点.在本文,我将重温 ...
- 最新Xcode7.x环境下上架iOS App到AppStore 完整流程
最新Xcode7.x环境下上架iOS App到AppStore 流程 part 1 前言部分 之前App要上架遇到些问题到网上搜上架教程发现都是一些老的版本的教程 ,目前iTunesConnect ...
- ios app 实现热更新(无需发新版本实现app添加新功能)
目前能够实现热更新的方法,总结起来有以下三种 1. 使用FaceBook 的开源框架 reactive native,使用js写原生的iOS应用 ios app可以在运行时从服务器拉取最新的js文件到 ...
随机推荐
- 安装win7 32位系统出现的问题解决办法
计算机意外地重新启动或遇到错误.Windows 安装无法继续.若要安装Windows,请单击“确定”重新启动计算机,然后重新启动安装”. http://www.baidusoso.net/ ...
- HashMap和Hashtable的区别(1)
导读: 1 HashMap不是线程安全的 hastmap实现了map接口,是将键映射到值的对象,其中键和值都是对象,并且不能包含重复键,但可以包含重复值.HashMap允许null key和null ...
- vijos1067守望者的逃离
裸的矩阵乘法,我却调了一上午……弱到爆啊…… 不过最终辛苦没有白费,我终于彻底搞懂了 要注意几点: 一.必须构造出前几项 二.用矩阵乘法算法之后还要手工算答案,利用首先算好的前几项 三.想好自己构造的 ...
- JDK版本1.6和6.0到底指什么
Both version numbers (1.6.0 and 6) are used to identify this release of the Java Platform. Version 6 ...
- Logminer实战
相信许多DBA同学都曾遇到过这种情况,由于各种各样的原因,必须对数据库做不完全恢复:但又不确定应该恢复到哪个时间点或SCN才合适,因而反复的执行不完全恢复,悲剧掉了一地,中枪的有木有?温馨提示下,在生 ...
- BingWallpaper
桌面壁纸更换成Bing.com的每日图片 项目地址:https://github.com/atskyline/BingWallpaper 其实就只是一个脚本,只是觉得二进制文件使用比较方便,所以采用C ...
- 【转】开发者教程:如何将Android应用发布到Google Play(Android Market)官方市场
原文网址:http://www.chinaapp.org/game/5594.html 作为一个专业的App开发者网站,竟然没有一篇讲述如何将Android App发布到Google Play的教程, ...
- JavaScript中定时器
JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.它们向任务队列添加定时任务. setTimeout() ...
- J2EE的若干问题
1.问题:jsp中out.println页面显示不出换行效果.例如: out.println("唱歌"); out.println("跳舞"); 以上代码的结果 ...
- LA 6540 Fibonacci Tree
以前做过的题···重新做一遍之后怎么做怎么wa···后来GG了···第二天看不知道为啥A了···难道我失忆了? 题意:无向图,边有黑色和白色两种颜色,求是否存在一个生成树中白边的个数是斐波那契数. 解 ...