網頁平面視覺稿的畫面如何製作？Mockdown 免費工具

2019-05-02 08:45:22 9M87

Mockups工具

對於平面設計師、網頁設計或提案者來說，常常需要提供成品草圖給業主、廠商看，常常需要花很多時間用 Photoshop 等繪圖軟體來繪製，今天跟大家分享這款線上工具 Mockdown，可以將網頁、軟體畫面利用 AI 自動轉換為草圖，包含色塊、排版、配色、圖形全部自動轉換，完全不需要在手動處理，就可以輕鬆產生模擬圖片！你也可以參考：Mockuper 把圖片偽裝在各種移動裝置，這麼專業叫美編怎麼活

Mockups工具
其實 Mockdown 的顯示常常出現大家的生活周遭，譬如說 Facebook、YouTube、DCard 等等，當網頁資訊還沒被讀取出來的時候，所呈現的狀態就是 Mockdown 的樣貌，也可以稱為 Mockup 視覺稿，讓大家可以預先知道這裡是有內容有文字的，只是還沒有被載入的狀態，若你想呈現的東西還沒有完整內容，想以概念圖的方式呈現，這款工具或許就是非常適合你的！

Mockdown

△ 進入 Mockdown 首頁後，可以看到中間的上傳區域，直接將要處理的畫面上傳就可以啦，因為目前 Mockdown 還處於 Beta 階段，希望收到更多的使用者回饋，因此目前還是免費的，未來正式啟用後，付費才能解鎖免費版沒有的功能。

圖片工具

△ 將圖片上傳後，等待一段時間就 OK 啦！下面提供兩張圖片讓大家參考輸入、輸出後的差異。

Mockups工具

視覺稿產生器

△ 拿本站的首頁截圖當作示範，可以看到不管是色塊、內文、標題等，都有相當精準的辨識度，令我相當驚訝的是沒想到歪國人做的服務，繁體中文轉換上也是沒有問題的！轉換成功後直接按右鍵就可另存圖片囉！趕快把這個佛心服務儲存起來吧～

馬上試試看！
https://epic.ai/mockdown/
更多資訊請參考：
虛擬主機推薦|台灣 VPS 推薦

網頁平面視覺稿的畫面如何製作？Mockdown 免費工具 相關文章

訪客留言

參考資料
Mockdown 線上將軟體介面 、網頁或應用程式擷圖轉為 Mockup 視覺稿 - 同乐城tlc手机app下载-首页
本文要介紹的「Mockdown」和前面提到的 Mockups 有關 ，這是一個方便的線上工具 ，可以將一般軟體畫面 、網頁擷圖或手機應用程式介面線上自動轉成 Mockups 圖片 。透過 Mockdown 會將原有可供辨識 、閱讀的文字圖片內容轉為色塊 ，如果要拿來做 ...
一鍵截圖長網頁、討論串，這個Google 雲端硬碟工具很好用 - 電腦玩物
這些網頁通常內容都需要捲動，所以要用上「長網頁」的截圖工具，可以一次把完整 ... 可擷取完整網站畫面、長網頁資料，甚至社群上的長討論串。 .... 【同一位妹妹當天，一次消費買三節，額外多送一節免費，共4節]，花3節錢享受4節 .... 小朋友學校的勞作作業想要製作家庭相框用照片來當小禮物把照片貼在紙本手帳上這 ...
GitHub - benbjohnsonmockdown.as: A Markdown-inspired Mockup ...
A Markdown-inspired Mockup Language. Contribute to benbjohnson/mockdown.as development by creating an account on GitHub.
oTranscribe 推薦！聽打逐字稿雲端服務，不用下載 ... - 免費資源網路社群
如果有做過論文研究，或是去外面進行訪談的話，一定都會接觸到逐字稿 ... 也不用在播放器和文書處理軟體間不斷切換、暫停，這項線上服務把暫停、慢速、打字、自動 ... 當你完成逐字稿後，可以把檔案匯出為Markdown（.md）或純文字（.txt）格式，也能 ... 分類：線上工具, 編輯推薦 標籤：學術研究, 工作效率, 文書處理, 網路服務, 網路科技, ...
設計衣服軟體 @ [衣服內衣T恤] :: 痞客邦 ::
免費設計簽名,免費線上設計藝術個性簽名,免費簽名設計軟體線上藝術簽名: ... Body Camera為基礎，快速量測3D人體資料，接著以Anthro3D軟體擷取相關的服裝設計尺寸資料，並轉換成為衣服的版型尺寸 ...
Mockdown - Convert hi fidelity screens to low fidelity ones
Pick a UI image and let mockdown do the rest. No Sketch or Photoshop necessary! Upload your screenshot and within a few seconds a your image will be transformed into a Mockdown. Right-click, save as and use any way you like.
【免費資源】有動態效果的懶人電子賀卡工具Canva-馬路科技網頁設計公司，免付費電話0800559999
先前馬路科技網頁設計曾經介紹過Canva這十分受到歡迎的線上設計工具，最近該公司宣布了一個全新的功能Canva Animation，就是將平面設計的卡片、圖片等變成動態的效果，非常適合用於製作網站的動態圖片內容、廣告、或是電子賀卡寄給客戶都很便利。
UI設計要學的4款軟體！PS AI？ - 每日頭條 - 每日新鮮頭條一網打盡
PS可以用來從事，平面設計，網頁設計，UI 設計等多種設計工作。在UI設計中PS的使用率在90%以上，所以作為一個合格的UI設計師。PS是肯定得掌握的 ...
免費工具Canva製作Facebook粉絲網頁設計-馬路科技網頁設計公司，免 ...
網路上有很多創新、免費的網頁設計資源，有些可以用於網站的草稿與線稿設計，也有繪圖軟體可以強化網站的視覺設計表現，還有很多奇特的網站提供 ... 接著進入了設計版型畫面，Canva除了提供今日要分享的Facebook粉絲網站主圖，連Po文使用的 ...
CloudConvert 免費雲端轉檔，可結合Dropbox、Google Drive 網路硬碟
遇到想將手邊的檔案轉檔，卻沒有適合的轉檔軟體嗎？ ... 接著在第三步驟勾選當完成時自動以Email 通知、或是把轉檔後的檔案直接儲存到Dropbox 或Google ... Mockdown 線上將軟體介面、網頁或應用程式擷圖轉為Mockup 視覺稿 ... 分類：線上工具, 線上轉檔 標籤：Dropbox, Google, Google Drive, 線上工具, 線上轉檔, 轉檔, 轉檔 ...