設計/資訊視覺化/教學與資源
馬上應用
ICON
- 500多種扁平化陰影 ICON 自動產生器！圖示免費下載
- AutoDraw https://www.autodraw.com/
- Google Material Icons https://material.io/icons/
- http://nathanfriend.io/inspirograph/ - 輔助你畫出齒輪軌跡圖
- Hipster Logo Generator - http://buzzorange.com/vidaorange/2015/02/25/hipster-logo-generator-customizable-designs/
- http://blog.infographics.tw/2015/05/build-gif-loader-with-loading-io/
- https://thenounproject.com/
- http://danklammer.com/articles/svg-stroke-ftw/
- 8bit https://make8bitart.com/ http://c64.superdefault.com/
- http://www.flaticon.com/
- Method Draw：線上icon客製化編輯 https://youtu.be/rL9dggIZ_wQ?list=PLdkvZCcLvKbYs5IFuPpMbGed4x31vhmAP
字體
- https://www.fontfont.com
- 日星鑄字行 http://typography.ascdc.sinica.edu.tw/%E5%AD%97/
- https://www.facebook.com/字型下載區-1442837152678167
- http://www.skyfont.com/
- https://www.facebook.com/dspim/posts/1850677385194059
筆刷
點線圖
- 點線圖 dotsDraw 混合式的製作方式，網址: http://vea.tw/works/dotsDraw/
圖表
- http://www.charted.co/ - 丟個CSV 就可以自動畫圖
- RAW Graphs. The missing link between spreadsheets and data visualization.
- https://www.facebook.com/data.visualize - 專門貼資料視覺化 - 利用各種工具，包含繪圖軟體、線上網站、函式庫甚至手繪來把資料視覺化的案例
- http://echarts.baidu.com/doc/example.html
- http://infogr.am - 很傻瓜又很炫的圖表產生器, 支援互動式操作
- http://www.datajournalismtw.com/#!about1/c1pkh
- https://www.facebook.com/shenhornyen/videos/10203789256250225/
- https://opensource.com/life/15/6/eight-open-source-data-visualization-tools?sc_cid=7016000000127ECAAY
- 關係圖 GXV Guan Xi Visualized
- 說明類資源
- http://dataviz.tools/
- 蒐集更多網站資源
- https://www.ft.com/content/304419ec-63a3-11e6-8310-ecf0bddad227
- http://blog.infographics.tw/2016/08/tips-on-basic-charts/
- http://www.datavizcatalogue.com/index.html
- https://www.facebook.com/data.visualize/photos/a.137798399723944.1073741827.137698833067234/635054893331623/?type=3&theater
表單
- Google 表單：不再只有醜醜範本！如何幫 Google 表單美化背景外觀？
- Typeform：https://www.typeform.com/
顏色 / 配色方案
- HCL Editor - 用等距分佈選六種顏色 ( http://goo.gl/mmdmG6 )
- xScope - 原文寫可模擬色盲者的世界, 但其實是組功能極強大的套件組! (http://goo.gl/MHTikR )
- 但是，要怎麼透過色盲人士的眼睛，檢查自己製作的圖表呢？網路上有一款免費的小工具「Color Oracle」，能夠解決這個問題。進入以下網址（http://colororacle.org/）
- Kuler - Adobe 的色輪工具, 可選類比 / 三色 / 對比 / 補色等等, 十分方便!http://goo.gl/PiyQrn
- Beautiful Colors, Every Day. http://colorhunt.co/
- https://www.facebook.com/freegroup/posts/10153725709878966
- https://www.facebook.com/FastCoDesign/videos/1151457734926968/
- 日本傳統色 http://nipponcolors.com/#tonoko
- https://www.facebook.com/permalink.php?story_fbid=10209467706870452&id=1259134110
- https://coolors.co/
- https://www.facebook.com/infoofinfographic/posts/1224055434346666
- 漸層範例 https://webgradients.com/
- https://www.facebook.com/media/set/?set=a.869836763159572.1073741850.270450253098229&type=3
素材
- 手繪簡單元素，電腦提供可能相對應的素材，提供選用
- https://jiemr.com/oriental-decoration-book
地圖相關
- pixelmap
- http://pixelmap.amcharts.com/
- http://artofslide.blogspot.tw/2017/04/pixel-map-generator.html?utm_source=%E7%B0%A1%E5%A0%B1%E8%97%9D%E8%A1%93%E7%83%98%E7%84%99%E5%9D%8A
- Mapfessional
格式轉換
- ai2html turns your Illustrator files into HTML. http://ai2html.org/
擬定合約
支援多人協作的設計工具
- 子龍的晾衣架: 零時政府 ｜說到設計如何開源協作這件事，給想要跨進g0v的設計師，一份關於設計開源協作的討論心得
網路協作工具
- https://www.canva.com/about
- https://webflow.com/
- http://froont.com/
- https://www.figma.com/
- http://workflowy.com/
- http://zbryikt.github.io/bezier-edit/
- https://www.facebook.com/data.visualize/posts/574521169384996 ？
3D 與 GIS 協作工具
設計觀念探討
- 挑選顏色是個大議題, 這篇教你怎麼做: http://goo.gl/eYk7fq
- g0v tw hackath10n 中場短講 今天 聊外貌 台灣零時政府第拾次資料科學黑客松 by 子龍
*
- AI WEBSITES THAT DESIGN THEMSELVES - https://thegrid.io/#7
- 將作品進行網格分析 http://grids.qoopu.net/
- g0v design guide 零時政府的視覺設計原則：G0V UI
- https://www.facebook.com/initiumlab/posts/2141441886081889
- 曼菲斯風格設計案例 http://goo.gl/TfJ2hH
- Best Practices in Data Visualizations
- 日本2017年1月DM分享
- https://www.behance.net/gallery/50411735/Baugasm-365-Posters
- Button
人因因素
- 字級大小原則討論 https://www.facebook.com/tamago.gogogo/posts/10210435887038098
- 「Design for Accessibility Cheatsheet」，從包含弱視、失讀、失聰等六個面向 https://www.facebook.com/data.visualize/posts/549909348512845:0
- Microsoft Inclusive Design http://mp.weixin.qq.com/s/ihsk7luLK595Khj-hcDVFw
- https://www.microsoft.com/en-us/design/inclusive
- xScope - 原文寫可模擬色盲者的世界, 但其實是組功能極強大的套件組! (http://goo.gl/MHTikR )
- 但是，要怎麼透過色盲人士的眼睛，檢查自己製作的圖表呢？網路上有一款免費的小工具「Color Oracle」，能夠解決這個問題。進入以下網址（http://colororacle.org/）
- 易讀服務 Easy Read Service
- http://www.sunable.net/node/31168
- http://www.changepeople.org/
- https://www.facebook.com/sunboytw/posts/10208167522296209
- https://www.facebook.com/groups/sunable/permalink/1334561573275993/
- 關於雲端千眼
- http://www.edocumentservice.org/
- 莎士比亞有句名言：「生活里沒有書籍，就好像大地沒有陽光；智慧里沒有書籍，就好像鳥兒沒有翅膀。」而『edocumentservice平台』的建立，主要便是希望透過平台，讓視障視障者能夠閱讀重製轉化後的電子書，並且透過平台自動化管理，減少視障視障者在取得資訊所遇到的困難。
更多資源蒐集區
- Quora: What are the best resources for learning bleeding edge web UI and UX design
- 日本中の「UI/UX」の参考になるスライド資料を気合いで全部集めました！（たぶん）http://boxil.jp/magazine/uiux/
- http://buzzorange.com/techorange/2015/05/28/design/
- http://resources.ogdesign.tw/
- https://www.facebook.com/data.visualize/posts/551794734990973
- https://www.facebook.com/imDataMan/posts/1812037675741857
- https://www.ordnancesurvey.co.uk/blog/2015/01/cartographic-design-principles-summary/#more-18093
- http://freedesignresources.net/
- http://readingforms.com/
- https://medium.com/sketch-app-sources/preparing-and-exporting-svg-icons-in-sketch-1a3d65b239bb#.67jygymit
- 日本2017年1月DM分享
- Tachyons 不是 css framework ，不送任何的套裝行程，但它把所有會用的 css 組合全都用最精簡而且不互相衝突的方式包起來，所以寫網頁時，直接標 class 就好，不另外寫 css ，像是 div 長寬比要多少、 padding, border 要多少等等。有興趣的人可以看這兩份字典：
- http://tachyons.io/docs/table-of-styles/
- http://tachyons.io/docs/table-of-properties/
- 蒐集手繪地圖案例網站 http://datored.wixsite.com/map-home
- https://www.tien-chang.com/amazingslide-ch01-4/
設計社群共筆區
素材