⚪互动媒体日常‍●交互漫画之对话框交互

码画疼中国区官方唯一代理

于 2020-11-30 04:06:40 发布

阅读量542

点赞数 1

分类专栏： p5.js 交互漫画

本文链接：https://blog.csdn.net/weixin_44341018/article/details/110362141

版权

这篇博客介绍了互动媒体中交互漫画的对话框交互设计，通过原创图片展示了从恐惧到平静的情绪转变。核心代码部分分为参数设置与资源加载、绘制与切换两个步骤，详细讲解了如何实现这一交互效果。

摘要由CSDN通过智能技术生成

互动媒体日常——交互漫画之对话框交互

效果尝鲜

在这里插入图片描述
（图片素材均为博主原创）

核心代码

1. 参数设置与资源加载

var img_bg=[];//所有背景
var img_c1_people;/
var img_c1_door;
var img_c2_cat=[];
var comicIndex=0;//用于切换漫画
var comicMax=2;//记录有多少页漫画
var timeInterval=0;//控制漫画中动画播放的间隙
var curIndex=0;//控制漫画中动画播放到第几帧
var frms=360,//对话框转动控制
	theta=0;
//预加载图片
function preload()
{
   
  img_bg[0]=loadImage("1_background.png");
  img_bg[1]=loadImage("2_background.png");
  img_c1_people=loadImage("1_people.png");
  img_c1_door=loadImage("1_door.png");
  img_c2_cat[0]=loadImage("2_cat1.png");
  img_c2_cat[1]=loadImage("2_cat2.png");
  img_c2_cat[2]=loadImage("2_cat2.png");
  img_c2_cat[3]=loadImage("2_cat3.png")</