• 相關文章
  • 文字效果
  • 調色教學
  • 合成教學
  • 去背教學
  • 照片後製
  • 電腦繪圖
  • 設計教學
  • 動畫教學
  • 簽名製作
  • 其他教學
  • Illustrator
  • CorelDraw教學
  • 攝影教學
  • 3DMAX教學
  • AUTOCAD教學
  • MAYA教學
  • FireWorks教學
  • flash教學
  • 繪畫教學
  • PS作品欣賞
  • 包裝設計範例
  • LOGO設計範例
  • 封面設計範例
  • 名片設計範例
  • CG繪圖設計
  • 海報設計
  • 網頁設計範例
  • PS筆刷下載
  • PS濾鏡下載
  • PS動作下載
  • PS背景下載
  • PS樣式下載




  • 【 設計教學 】InVision網站免費可商用的UI資源包




    InVision網站免費可商用的UI資源包

    這一次的教學是屬於攝影作品領域中的其他資訊的相關教學。

    文章出處是來自優設的攝影作品類文章,寫教學的作者是free.com.tw,感謝free.com.tw提供其他資訊的實作教學。

    教學大綱:

    不知道大家有沒有聽過 InVision 呢?這是一家總部位於紐約的公司,主要提供設計師共享設計原型,利用這個平台可以更輕易與其他人討論、修改設計,同時也可以獲得更為實時回饋。利用 InVision 讓設計不再是設計師或設計團隊的工作,全體員工都能參與,以創造出


    其他資訊教學開始

    不知道大家有沒有聽過 InVision 呢?這是一家總部位於紐約的公司,主要提供設計師共享設計原型,利用這個平台可以更輕易與其他人討論、修改設計,同時也可以獲得更為實時回饋。利用 InVision 讓設計不再是設計師或設計團隊的工作,全體員工都能參與,以創造出更精緻的設計,使用者也能獲得更好的使用體驗。

    近期 InVision 釋出一款名為「Chat」的UI資源包讓需要的開發者免費下載!依照網站提供的圖片,可以看到這款設計非常簡約美觀,帶有Material Design 設計風格。

    無論網頁、平板計算機或手持設備—「Chat」一手包辦!包括 60 種模版、12 種類及 80 個UI界面組件,使用這套設計包可協助你打造出最棒的應用程序。

    設計精簡化,同時也有乾淨利落、平面效果,讓使用者將注意力放在畫面內容,而不會被界面混淆。如果你正好在開發一款 App ,或者想從其他人的設計找尋靈感,以下我會教你如何免費下載「Chat」,包含 Sketch 和 Photoshop 適用的兩種檔案版本。

    Chat UI kit by InVision

    STEP 1

    開啟「Chat UI kit by InVision」網頁后,往下拖曳找到 Screens,這裡收錄許多 Chat 實際操作的畫面擷圖,可以看到它的設計偏向於 Material Design 且有平面化效果。點選右邊的選單按鈕,還能找到在登入、註冊、個人檔案、主畫面、聊天室、相簿、狀態、設定等不同功能的效果。

    InVision網站免費可商用的UI資源包

    STEP 2

    點選畫面截圖來放大設計。不得不說這套「Chat」用戶接口設計包實在非常好看!可惜我沒有要開發應用程序,不然可能會很想直接將它拿來套用。

    InVision網站免費可商用的UI資源包

    STEP 3

    將畫面拖曳到最底下的「Download」部分,輸入你的 Email 後點選「Send」來收取下載鏈結。InVision 會把下載點寄到你的 Email 信箱,請記得填寫正確。

    InVision網站免費可商用的UI資源包

    STEP 4

    開啟 InVision 寄來的郵件,郵件內就有「Download Chat UI kit」兩個鏈結按鈕,分別可以取得 Photoshop 和 Sketch 的兩種文件格式!

    InVision網站免費可商用的UI資源包

    — —

    文章永久連結為: InVision網站免費可商用的UI資源包