快速掌握 Origami Studio余黎。學(xué)習(xí)如何搭建奋渔、預(yù)覽和分享原型张足。
▼
1. Getting Started 入門
本篇將講解如何搭建一個簡單的基礎(chǔ)原型笨枯。通過跟隨教程一起搭建原型可以更快度的了解 Origami Studio 的基礎(chǔ)知識。并講解了如何從Sketch等設(shè)計工具導(dǎo)入設(shè)計圖 ... 查看更多
▼
2. Previewing and Sharing 預(yù)覽和分享
在 Origami 上制作的原型可以在電腦模擬器上和移動設(shè)備上操作锯蛀,所有的變更實時同步到模擬器和移動設(shè)備灭衷。原型可以導(dǎo)出 ... 查看更多
▼
3. Coming From Code 來自代碼
在 Origami 原型中使用函數(shù)和添加邏輯很簡單,但如果以編程的角度出發(fā)可能會有跟您預(yù)期的有一些不一樣旁涤。
如果你 ... 查看更多
Common Interactions 常見交互
▼
4. Adding Logic 添加邏輯
有時候我們希望原型上的交互只在特定的的情況下發(fā)生 - 當(dāng)布爾值為真或假時今布,或者讓多個事物控制一個交互经备,比如兩個不同的按鈕 ... 查看更多
▼
5. Scrolling Views 滾動
滾動在 Origami 中很簡單拭抬,也非常靈活部默。通過創(chuàng)建基本的 Messenger 原型學(xué)習(xí)如何使用滾動。 先下載 ... 查看更多
▼
6. Horizontal Scrolling 水平滾動
有時候需要實現(xiàn)分頁滾動或循環(huán)幻燈片造虎。通過我們已經(jīng)掌握的知識搭建這個Facebook Events 的原型傅蹂,學(xué)會如何分頁滾動 ... 查看更多
▼
7. Screen Transitions 屏幕切換
在 Origami 中創(chuàng)建屏幕流程比你想的要容易得多,并且仍然允許在屏幕內(nèi)進行復(fù)雜的交互算凿。通過搭建 Instagram Boomerang 界面 ... 查看更多
▼
8. Timed Animations 延遲動畫
有時你會想要一個動畫自動啟動 - 原型開始時份蝴,或有一個定時器觸發(fā)它。有時你想要多個 ... 查看更多
Smarter Interactions 更智能的交互
▼
9. Multiple States 多個狀態(tài)切換
我們已經(jīng)學(xué)會了用 Switch 模塊在兩個狀態(tài)間切換氓轰,那怎么在兩個以上的狀態(tài)間切換呢婚夫?如 Tab 欄 ... 查看更多
▼
10. Masking Layers 剪切蒙版
剪切蒙版在 Origami 中跟在其他的設(shè)計工具一樣,還可以使用來創(chuàng)建高級互動和動畫署鸡,我們將 ... 查看更多
▼
11. Introduction to Loops 介紹循環(huán)
循環(huán)相當(dāng)于 Sketch 里的模板案糙。使用循環(huán)能降低原型復(fù)雜度,當(dāng)常見元素能復(fù)用時也是節(jié)省時間的好方法靴庆。這個 Facebook 通知的原型包含一個循環(huán)通知时捌,跟 ... 查看更多
▼
12. Interactive Loops 交互循環(huán)
Looped items in Origami are able to have interaction applied to them like any other layer in Origami would. In this Facebook Notifications prototype, we have applied a Color property
在 Origami 中循環(huán)能像圖層一樣相互應(yīng)用。
在這個 Facebook 通知原型中炉抒,我們已經(jīng)應(yīng)用了一個Color屬性 ... 查看更多