在清晰的故事情节中创建一个有趣的电子学习GUI设计-第1部分

这篇博文分享了如何自定义清晰的故事情节来创建独特的gui。

Flash到HTML5的转换
在清晰的故事情节中创建一个有趣的电子学习GUI设计

许多组织希望他们的品牌颜色和标识反映在他们的在线课程的图形用户界面(GUI)中,一些甚至指定他们自己的尺寸。今天,大多数可用的快速创作工具允许您定制您的电子学习课程的GUI,而无需编程。但这门课的其他特点就不是这样了。

今天,我们将看看我们如何满足我们的一个客户的复杂要求。的要求是:

  1. GUI的尺寸是800px(宽)X 600px(高)
  2. 回来下一个玩家的按钮将根据公司的品牌颜色定制
  3. 标识将被放置在左上角
  4. 退出按钮只出现在最后一页

让我们看看如何使用清晰的故事线来满足这些需求。

步骤1

首先,我们将设置所需的维度。去设计选项卡并单击故事的大小;输入宽度为800px,高度为600。在此之前,取消选中锁定纵横比

步骤1

步骤2

要删除所有默认的播放器设置,请从首页选项卡。

步骤2

步骤3

现在删除回来下一个按钮。点击Base图层齿轮图标去掉勾号。

步骤3

步骤4

现在删除背景边框和轮廓。这将在预览期间启用。

步骤4

步骤5

主幻灯片添加一个矩形大纲,图像和文本的占位符。然后在需要的地方添加logo。我把它加在了左上角。

步骤5

步骤6

然后加入回来下一个底部的按钮;我们也可以在主幻灯片中添加这些按钮,但我们将它们放在每张幻灯片上,因为只有在动画和交互性完成时,我们才需要移到下一张幻灯片。

步骤6

步骤7

最后,添加退出按钮记录完成状态和回来按钮返回到航向内。

步骤7

按照上面提到的步骤,可以很容易地定制GUI。继续为自己定制一个GUI。您还可以根据自己的需求定制其他选项。希望这篇文章对你有用。一定要分享你的观点。

how-to-select-right-rapid-authoring-tool-cta
如何选择合适的快速创作工具
在清晰的故事情节中创建一个有趣的电子学习GUI设计
复制链接