1. 程式人生 > >30秒製作互動原型的次時代神器FLINTO

30秒製作互動原型的次時代神器FLINTO

前幾天給大家做了“互動軟體大保健”,推薦了最近剛出的幾款原型製作軟體,各有優劣。今天給大家詳細介紹下次時代互動神器:Flinto。

Flinto的前身是一款線上製作原型的工具,通過上傳圖片,新增熱點配合相應的互動動作快速的生成整體原型通過網頁或者手機端展示給客戶觀看,與之前介紹的Briefs非常相似,但Flinto是線上應用。

隨著移動裝置的普及,Flinto也不斷進化,團隊開發出了Flinto for mac 版本,截止到現在的版本是Flinto 1.12

任何工具的出現都是為了提高我們的效率。作為一款互動原型製作軟體首先要滿足:

  1. 可以人機互動
  2. 便於設計師與其他人員溝通
  3. 減少開發成本

—————-Flinto的一些效果—————-

也許我們很難想象,以上的後面三個效果都是在極短的時間內完成的(極短<=5分鐘)

目前的Flinto除了擁有透明度變化,XYZ軸旋轉,XY軸位移,運動曲線調整,移動端儲存預覽,等基礎功能之外,最大的優點有五個:

  1. 整體互動原型的製作
  2. 與sketch無縫配合
  3. 製作速度快
  4. 製作速度真快
  5. 製作速度非常快

下面我們要製作如上圖的效果:

  1. 首先在sketch中繪製靜態效果圖
  2. 利用Flinto外掛一鍵匯出到Flinto,點選相應圖片新增觸發互動的行為,這裡是Tap,即單擊,新建變化(New transition)
  3. 把背景層透明度調整為0,調整整個圖層位置,連結放大圖片到小圖片,調節運動引數
  4. 儲存動作,選擇四張圖片成組製作滾動scroll,新增返回行為,預覽效果。

以上的效果我製作原型其實只用了不到20秒。

之所以那麼短的時間得益於Flinto的connet layer(類似於Flash的補間動畫)的作用,使圖層之間的變化可以非常迅速的製作,並且Back link功能使我們可以一鍵製作原型的返回效果,這兩點無疑大大加快了製作速度,並且由New Transition製作的互動動作和connet layer的標籤還可以重複使用,總之,難以想象的快。