[筆記] MarkMan 跨平台 設計稿標註與量測工具

Posted onAuthorANDY LIEN

章節連結

前幾週在六角學院的線上課程看到有個好用的 MarkMan 線上平台工具可以使用，讓你可以輕鬆的讀取和量測圖片上的顏色、大小。雖說不能夠讀取圖片上的字體，但在不開啟如 Photoshop 之類的軟體就能達到工作需求，算是很實用了。
markman logo

下載並安裝

1. 登入 MarkMan 官網後，點選左方的下載按鈕開始安裝
markman official website 2. 此安裝包是利用 Adobe AIR，如果沒有這個軟體的，要先上 Adobe 的官網下載，才能成功開啟安裝檔
markman website download

如何使用

1. 開啟程式後，就將要用來分析的圖片運用”拖拉放”的技巧到程式畫面中央。
markman screen2. 完成了。你可以運用下方的滴管和量測尺，就可以得知色碼(Hex)和距離像素。
markman demo markman logo demo2

技術筆記相關文章

  • [筆記] 六角學院 2022 React 新手讀書會 – 4
  • [指南] 前端開發用的 CORS Anywhere via Cloudflare Workers
  • [筆記] Ultimate AWS Certified Developer Associate (69)
  • [指南] Heroku 免費 Dyno 取消後的去處 – Fly.io, Render 和 Supabase
  • [筆記] 六角學院 2022 React 新手讀書會 – 3
  • [筆記] Ultimate AWS Certified Developer Associate (63)
  • [筆記] 六角學院 2022 React 新手讀書會 – 2
  • [筆記] Ultimate AWS Certified Developer Associate (62)
  • [筆記] Vue3 Element Plus 前端分頁、排序和搜尋邏輯
  • [筆記] Ultimate AWS Certified Developer Associate (61)
  • [筆記] Ultimate AWS Certified Developer Associate (59)
  • [筆記] 六角學院 2022 React 新手讀書會 – 1
  • [筆記] Ultimate AWS Certified Developer Associate (58)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (72)
  • [筆記] Ultimate AWS Certified Developer Associate (57)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (71)
  • [筆記] Ultimate AWS Certified Developer Associate (56)
  • [筆記] Ultimate AWS Certified Developer Associate (55)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (70)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (69)
  • [筆記] Ultimate AWS Certified Developer Associate (54)
  • [筆記] Ultimate AWS Certified Developer Associate (53)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (68)
  • [指南] Buefy 搭配 Autocomplete 的思考邏輯
  • [筆記] Ultimate AWS Certified Developer Associate (52)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (67)
  • [筆記] Ultimate AWS Certified Developer Associate (51)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (66)
  • [筆記] Ultimate AWS Certified Developer Associate (50)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (65)
  • [指南] Element UI Pagination 同步思路和避免錯誤
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (64)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (63)
  • [筆記] Ultimate AWS Certified Developer Associate (48)
  • [筆記] Ultimate AWS Certified Developer Associate (47)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (62)
  • [指南] Vue 動態路由後續加載的兩種處理方式
  • [筆記] Ultimate AWS Certified Developer Associate (46)
  • [指南] 從 Vuex 改用 Pinia 的思路轉換記錄
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (61)
  • [指南] Element UI 搭配 i18N form 表單錯誤訊息不會自動切換語言的解決方法
  • [筆記] Ultimate AWS Certified Developer Associate (45)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (60)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (59)
  • [筆記] Ultimate AWS Certified Developer Associate (44)
  • [筆記] Ultimate AWS Certified Developer Associate (43)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (58)
  • [指南] Auth0 SPA Vue2 串接精簡指南
  • [筆記] Ultimate AWS Certified Developer Associate (42)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (57)
  • [筆記] Ultimate AWS Certified Developer Associate (41)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (56)
  • [筆記] Ultimate AWS Certified Developer Associate (40)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (55)
  • [筆記] Ultimate AWS Certified Developer Associate (39)
  • [筆記] Ultimate AWS Certified Developer Associate (38)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (54)
  • [指南] Vue Proxy Server 搭配 POST 的正確使用方式
  • [筆記] Ultimate AWS Certified Developer Associate (37)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (53)
  • [筆記] Ultimate AWS Certified Developer Associate (36)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (52)
  • [筆記] Ultimate AWS Certified Developer Associate (35)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (51)
  • [筆記] Ultimate AWS Certified Developer Associate (34)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (50)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 18 multer 上傳到 imgur 功能
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (49)
  • [筆記] Ultimate AWS Certified Developer Associate (33)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (48)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 17 JWT 登入註冊功能
  • [筆記] Ultimate AWS Certified Developer Associate (32)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (47)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (46)
  • [筆記] Ultimate AWS Certified Developer Associate (31)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (45)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 16 Swagger 初步教學
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (44)
  • [筆記] Ultimate AWS Certified Developer Associate (30)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (43)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 15 全方面的 Error 管理
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (42)
  • [筆記] Ultimate AWS Certified Developer Associate (29)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 14 Middleware 設計
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (41)
  • [筆記] Ultimate AWS Certified Developer Associate (28)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 13 Express 框架初探
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 12 連接遠端資料庫和環境變數設置
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (40)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (39)
  • [筆記] Ultimate AWS Certified Developer Associate (27)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (38)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 11 Mongoose 實作運用
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (37)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 10 Mongoose 額外補充和模組化
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (36)
  • [筆記] Ultimate AWS Certified Developer Associate (26)
  • [筆記] 六角學院 Node.js 2022 直播班記錄 – 9 Mongoose 連線基本操作
  • [筆記] Ultimate AWS Certified Developer Associate (25)
  • [筆記] Udemy – CSS3 Animations, Transforms and Transitions Ultimate Guide (35)
    • 按讚加入粉絲團

    延伸閱讀