設計/資訊視覺化/教學與資源
編輯歷史
| 時間 | 作者 | 版本 |
|---|---|---|
| 2017-07-07 17:09 – 17:09 | r0 – r1 | |
顯示 diff+ 設計/資訊視覺化/教學與資源
+
+ *馬上應用
+
+ 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
+
+ 筆刷
+ *台灣食物
+ *https://www.plurk.com/m/p/m2xxq1
+ *https://www.facebook.com/tikalyangfc/posts/1350010351712040
+
+ 點線圖
+ *點線圖 dotsDraw 混合式的製作方式，網址: http://vea.tw/works/dotsDraw/
+
+ 圖表
+ *http://www.charted.co/ - 丟個CSV 就可以自動畫圖
+ *RAW Graphs. The missing link between spreadsheets and data visualization.
+ *http://app.rawgraphs.io/
+ *http://raw.densitydesign.org
+ *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://buzzorange.com/techorange/2014/06/10/30-simple-tools-for-data-visualization/
+ *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://www.autodraw.com/
+ *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/
+
+ 擬定合約
+ *https://www.and.co/the-freelance-contract
+
+ *支援多人協作的設計工具
+ *子龍的晾衣架: 零時政府 ｜說到設計如何開源協作這件事，給想要跨進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 協作工具
+ *Crowd Planning System Prototype
+
+
+ *設計觀念探討
+ *挑選顏色是個大議題, 這篇教你怎麼做: 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
+ *https://www.microstrategy.com/Strategy/media/downloads/training-events/microstrategy-world/2014-barcelona/MSTRWorldEU2014_T1_S3_Best_Practices_in_Data_Visualizations.pdf?ext=.pdf
+ *日本2017年1月DM分享
+ *https://www.facebook.com/jack3020/media_set?set=a.10210192953292445.1073741830.1597726891&type=3
+ *https://www.behance.net/gallery/50411735/Baugasm-365-Posters
+ *Button
+ *https://medium.com/ux-power-tools/a-better-way-to-make-buttons-in-sketch-6c23470f27c#.5dn805gtb
+
+ 人因因素
+ *字級大小原則討論 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分享
+ *https://www.facebook.com/jack3020/media_set?set=a.10210192953292445.1073741830.1597726891&type=3
+ *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/
+
+
+ 設計社群共筆區
+ *https://uiuxlink.hackpad.com/
+ 素材
+ *https://www.sitebuilderreport.com/stock-up
|
||