最近 Adobe XD 到期,順便轉用 Figma 來進行網頁設計
因為過去有用 Sketch + XD 的經驗,許多概念都可以直接移到 Figma
其中包含:
- 最愛的 Prototype 功能,拉好之後團隊就能進行操作
- 響應式的元件,比 XD 更多的細節調整
- 元件管理,統一設定所有的元素
- ... 還有各種想得到的基本功能
除了可以做到與 Adobe XD 與 Sketch 類似的功能外
還具有以下的優點:
- 團隊協作更即時,不需要截圖傳來傳去,直接看到團隊的指標位置(工程師隊友不需要付費,只要有觀看權限即可
- 強大的 Frame,讓繪圖軟體更具有響應式的特性
- 智能選取,調整群體元素間距、順序都非常好用(這就需要實際體會才能理解了
如果你正在觀望 Figma,此工具還有提供免費的版本
只要註冊後直接就可以直接在瀏覽器運行
不知道怎麼入門嗎?
我們最近舉辦了 Figma 體驗營,歡迎來參與看看~
https://hex.school/V92BO
---
其它常見問題:
Q、參加 Figma 設計體驗營會需要付費嗎?
這次的體驗營完全免費!請大力分享給身邊有興趣的朋友們 ʕ •ᴥ•ʔ
Q、一定要加入 Discord 群組嗎?
卡斯伯回:我們資源太多,怕你沒加入會少接收到很多資訊
Q、如果這次的時間剛好沒辦法參加,之後會有加開的場次嗎?
卡斯伯回:這次免費,下次我不敢說
Q、Figma 很貴嗎?
卡斯伯回:看你怎麼用囉~,費用很彈性,如果是單人使用幾乎免費,團隊的話則是依據設計師人數計價(僅有觀看的工程師不需要付費
網頁設計 prototype 在 DOC職人 時食刻客 Facebook 的最佳解答
【社區網頁設計課,手繪UI】臺東卑南
~全民學程式,前端設計接地氣
~DOC學員得獎作品,手繪網頁:http://ks-kisa.com/twftp/2020OP/tt/bei/index.html
如果想要設計一個網頁/站、或一個App ,
你會如何開始呢…?
小店、小農時間有限,大都委託公司來規畫設計,但溝通的時間冗長,一張圖或一個標題,大家有意見,換來換去。
你何不花點時間,把你要的,你想的,「畫」給設計師呢?讓完成的網頁/網站,能完整展現你的想法。
⋯⋯⋯⋯⋯
想學會設計網頁、撰寫網站,先瞭解「Prototype」,Prototype 泛指一個產品的初始樣式,有人說「原型」,也有人說「雛型」。
在網頁/網站的設計上,很多人會用「手繪」,畫出網站的UI,並以UX完成整個網站。
針對在地的小農、小店、返鄉青年,東東澎數位機會中心,開辦了「導購網頁暨形象網頁的課程與競賽」,從「Prototype」的手繪網頁開始,讓傳統行銷可以轉型為數位行銷,讓有興趣程式設計的學員,有一個自我實現數位內容應用的平台。
--------
卑南數位
祝台東 - 臺東DOC
#DOC數位機會中心
#城鄉交流數位應用
--------
更多職人 : http://expert.chineseink.com.tw/client/default.aspx
--------
Doc年貨大街
http://docmall.doctw.com/index.php
--------
Kisa 行銷企劃
http://www.ks-kisa.com/index.html
網頁設計 prototype 在 軟體開發學習資訊分享 Facebook 的最佳解答
課程簡介
網頁前端設計在現代越來越重要,是許多程式設計師的第一門課程、青壯年轉換職業跑道的門路、平面設計師的必修。此課程會一步一步帶者你走,讓你能夠從頭開始架設屬於你自己的網頁!你不需要有任何的程式設計經驗,也不需要有相關的背景知識。開始學習網頁前端技術,讓你學會一技之長,能夠開啟網頁技術的大門。
在這堂課程結束之後,你將能夠使用:
1 前端網頁技術開發
2 VS Code 操作技巧以及實用熱門Extension
3 HTML5 – HTML5 – 超文件標記語言
4 CSS3 – CSS3 – 階層式樣式表
5 JavaScript – 網頁前端後端程式語言
6 了解DOM, Hoisting, Scope, Closure, Prototype Inheritance, execution context, callbacks, this keyword, bind call apply functions等進階JS觀念與運用
7 Bootstrap
8 Git and GitHub, Source Tree 版本控制
9 Figma – UI/UX設計工具
10 打造有形網站,架構出自己的現代風格網頁
11 將網站架構到雲端主機,讓大家看到你的作品
12 Flexbox開發技術,讓你做RWD事半功倍
13 學習進階前端開發技術,解決你對前端網頁排版的諸多疑惑
https://softnshare.com/html5-css3-z/