幾天突然看到運營喵推送文章，原型設計：百詞斬單詞翻轉還原效果實現，作者xuruiuiui，仔細看了下文章，發現作者是用墨刀這個軟件做的，且是點擊效果和百詞斬首頁還是有點差別的，然后一時手癢，自己重新用Axure做了下這個原型。
百詞斬官網效果如下：
用Axure做的百詞斬原型錄屏。
以下是我制作該原型的步驟：
工具：Axure
1、選取組件：動態面板，動態面板的大小為300*260。
2、對動態面板進行正反2面設置。
3、點擊動態面板中正模塊進入正模塊，并對模塊動態框內進行crawl文字或圖片插入。
4、點擊動態面板中反模塊進入反模塊，并對模塊動態框內進行視頻或圖片插入。
5、設置反面交互事件。
設計交互，選擇當鼠標移入時，設置面板狀態-選擇Crawl動態面板-進入和退出狀態分別為向右翻轉-推動拉動元件。
具體請看下圖：
6、設置正面面交互事件，方式和設置反面一樣。
歡迎指正。
本文為@運營喵原創，運營喵專欄作者。
