1.界面设计

　　打开Articulate Storyline 3，新建一个项目。在“故事视图”状态，双击“无标题幻灯片”进入编辑窗口。在空白处右击，选择“设置背景格式”，在弹出的窗口设置好所需要的背景：切换到“设计”选项卡，点击“文章大小”，在弹出的窗口中根据需要设置好幻灯片的大小。切换到“插入”选项卡，点击“图片→来自文件的图片”，插入所需要的插图，再利用形状、文本框等插入装饰性的元素及必要的文字说明;接下来，依次点击“输入→数据条目→文本输入字段”，在幻灯片的合适位置画出输入框，选中这个输入框，设置好它的边框、填充色、字体及字号等。当在幻灯片中插入元素时，就会在时间轴上显示相应的元素名称及内容。为了将这些输入文本框区分开，可以在元素相应的时间轴上双击，更改它们的名称，如可以将第1个输入文本框的名称更改为“sz1”，将第2个输入文本框的名称更改为“sz2”，以此类推。再插入一个按钮，设置好它的图标及文字等。这样，交互式填空题幻灯片的界面就设计完成了（图2）。

2.添加交互显示

　　在右侧“幻灯片层”处，点击“新建层”，双击新建的这个层的名称，将其更改为“正确”，并在这个图层中利用形状中的图形或其他图片等，设计好正确时所需要显示的界面。再新建一个图层，将其名称更改为“错误”，同样为这个图层设计好错误时所需要显示的界面（图3）。
　　在本例的交互中，涉及到“正确”答案的情况，可能会有“6乘3加2”、“3乘6加2”或“3乘4加8”等情况，为此需要全面考虑各种可能进行设计，才能不漏掉所有的正确答案，做到更完美。下面以“正确”交互中的前两种情况为例介绍。
　　切换到“基础层”，选定“完成”按钮，新增触发器，在弹出窗口的操作处选择“显示图层”，图层处选择“正确”，时间处选择“用户单击”，对象处选择“按钮1”，点击“显示条件”;点击“+”，在弹出的窗口选择“变量”，如果处选择“文本输入题”（即sz1），运算符处选择“==等于”，类型处选择“值”，值处输入“6”（这个数字为图片每行的数量）;再点击“+”，在弹出窗口的“和/或”处选择“AND”，列表处选择“变量”，如果处选择“文本输入题1”（即sz2），运算符处选择“==等于”，类型处选择“值”，值处输入“3”（即图片的数）;再点击“+”，在弹出窗口的“和/或”处选择“AND”，列表处选择“变量”，如果处选择“文本输入题2”（即sz3），运算符处选择“==等于”，类型处选择“值”，值处输入“2”（即不满足成行的图片数）;再点击“+”，在弹出窗口的“和/或”处选择“AND”，列表处选择“变量”，如果处选择“文本输入题3”（即sz4），运算符处选择“==等于”，类型处选择“值”，值处输入“20”（即算式的计算结果）。这样，有关“正确”的第一种情况就表达完成了。

　　接下來设置“正确”的第二种交互情况。新增触发器，在弹出窗口的操作处选择“显示图层”，图层处选择“正确”，时间处选择“用户单击”，对象处选择“按钮1”，点击“显示条件”;点击“+”，在弹出的窗口选择“变量”，如果处选择“文本输入题”（即sz1），运算符处选择“==等于”，类型处选择“值”，值处输入“3”（这个数字为图片每行的数量）;再点击“+”，在弹出窗口的“和/或”处选择“AND”，列表处选择“变量”，如果处选择“文本输入题1”（即sz2），运算符处选择“==等于”，类型处选择“值”，值处输入“6”（即图片的数）;再点击“+”，在弹出窗口的“和/或”处选择“AND”，列表处选择“变量”，如果处选择“文本输入题2”（即sz3），运算符处选择“==等于”，类型处选择“值”;值处输入“2”（即不满足成行的图片数）;再点击“+”，在弹出窗口的“和/或”处选择“AND”，列表处选择“变量”，如果处选择“文本输入题3”（即sz4），运算符处选择“==等于”，类型处选择“值”，值处输入“20”（即算式的计算结果）。这样，第二种交互情况的表达就完成了。如果还有其他情况，可依此类推（图4）。
　　同样道理，“错误”提示的显示设置与这个类似。如新增触发器，在弹出窗口的操作处选择“显示图层”，图层处选择“错误”，时间处选择“用户单击”，对象处选择“按钮1”，点击“显示条件”;点击“+”，在弹出的窗口选择“变量”，如果处选择“文本输入题3”（即sz4），运算符处选择“！=不等于”，类型处选择“值”，值处输入“20”。这样，当计算结果不等于“20”时，则显示错误提示。如果还有其他情况，依此类推（图5）。

3.作品发布

　　点击“播放器”按钮，在弹出窗口的功能选项卡中，将资源、菜单之类的勾选全部去掉。最后，点击“发布”按钮，在弹出的窗口选择VVeb选项卡，输入标题，设置好发布文件夹，发布就可以了。