網頁設計師專用書籤: Hypershoot 拍下你的網站靈感


當你正在規劃一個網站的版面設計、想要製作一個活動網頁、想要上線一個購物網頁,這時候或許需要從其他網站的設計中尋找一些靈感啟發,那麼,平常有沒有什麼好工具可以幫我們「收集網頁設計靈感」呢?

我立刻想到一些方法,例如就單純用瀏覽器的書籤儲存這些網站的網址連結? Google 最新版書籤也能顯示部分網站預覽圖,但還是無法把真正需要的「畫面」儲存下來。或者用 Evernote 擷取網頁?但是 Evernote 不能拍照長網頁,一般網頁擷取也無法完美保留版面格式。

上面的問題讓我們可以思考,什麼是網頁設計師需要的網站書籤工具?這樣的書籤工具目的不只是記下網址而已,而是要「拍下畫面」。而今天要介紹的「 Hypershoot 」或許就是一個為了幫網頁設計師收集靈感而誕生的書籤工具。

有了利用「 Hypershoot 」收集而來的網頁設計畫面靈感,再搭配我在電腦玩物上介紹過的,像是「網頁原型設計工具」,或是可以下載後修改的「免費網頁模版」,就更加如虎添翼。

下面這段影片,我幫大家用旁白快速介紹 Hypershoot 的特色,你可以在影片中看到,他甚至會同時幫你抓取並自動儲存一個網頁電腦版與手機版的畫面!





1.
「 Hypershoot 」最大的特色就是當我們輸入網址,或是用瀏覽器套件來儲存某一個網頁時,他會:

雲端自動拍下完整的長網頁畫面

有點像是我們常說的「截圖工具」,但又不太一樣,因為它是透過雲端抓圖的方式,把你目前要儲存的網頁完整畫面照片轉存到「 Hypershoot 」雲端書籤網站中,讓我們可以雲端整理、分享這些「網頁照片」。

這樣一來,「 Hypershoot 」就很適合我們隨時儲存自己可以做為參考的網頁畫面,把一張一張網站照片雲端管理。




2.
使用「 Hypershoot 」的過程也很簡單,註冊一個帳號後,安裝「 Hypershoot 」的瀏覽器套件,就能隨時利用瀏覽器套件抓拍網頁畫面。




3.
「 Hypershoot 」抓下來的網站畫面都會儲存在我們的雲端書籤中,一張一張網頁照片也包含網頁連結,都可以在「 Library 」中看到。



而且我們也能進一步在「 Hypershoot 」服務中進行分類管理,例如把某一個設計專案要用到的網站畫面分類到「 Board 」中。

或者我們也可以針對收集的網頁畫面進行評分、標籤,這樣一來當收集的資料愈來愈多時,就能快速回頭找到值得參考的網頁照片。




4.
有一點要注意的是,目前利用「 Hypershoot 」收集(拍照)的網頁畫面都是呈現公開的狀態!也就是每個用戶拍下的網頁畫面,都可以被其他「 Hypershoot 」搜尋到。

在「 Hypershoot 」服務中進入「 Discover 」頁面,就可以看到最近其他人收集的網頁畫面,或者我們可以輸入關鍵字,找到自己想要研究的網頁設計。




5.
而當我們把收集來的網頁畫面分類到不同的 Board 後,我們還可以分享這個 Board 的網址,這樣其他人或其他工作夥伴,可以透過網址來參考我收集的網頁設計。

Pinterest 類型服務不同的是, Pinterest 收集的是某一張圖片或照片,而「 Hypershoot 」收集的是整個網頁的畫面,可以說是專門給網頁設計師使用的書籤工具。

而如果你需要相關網頁設計資源,或許你還有興趣參考:

轉貼本文時禁止修改,禁止商業使用,並且必須註明來自電腦玩物原創作者 esor huang(異塵行者),及附上原文連結:網頁設計師專用書籤: Hypershoot 拍下網站畫面靈感


留言

  1. 感謝大大分享,如果是想要擷取長長的網頁的話,
    http://www.apowersoft.tw/screen-capture-pro
    這個也可以做到的,而且還有多邊形的截圖方式,也提供了雲端存儲空間,還可以加密,這個就比Pinterest和Hypershoot好一些了

    回覆刪除
  2. 站長您好, Hypershoot儲存網站時把中文字統一變為標階體了, 未知是否有方法保留原來字型?

    回覆刪除
  3. 這是目前被認為是設計網站,很好看的最佳途徑之一任何設備,從智能手機到智能電視上。

    回覆刪除

張貼留言

為了避免垃圾廣告留言過多,開始測試「留言管理」機制,讓我可以更容易回應讀者留言,並更簡單過濾掉廣告,但只要不是廣告留言都會通過審核。

這個網誌中的熱門文章

全家沖印、 7-11 列印照片誰好用?立可得與 ibon教學+比較表

Google Maps 我的地圖完全教學!規劃自助旅行攻略

微軟 Bing AI 繪圖工具 Image Creator 免費開放,30秒輕鬆生成圖片

Arc 瀏覽器 windows 版測試心得,用四大介面改造升級專注工作流

Readwise Reader 如何自訂 AI 中文摘要指令?我的 prompts 分享

Draw.io 中文線上製作流程圖首選!專業水準完全免費

Evernote 大綱收合、目錄連結、錨點連結,整理超長筆記應用案例分享

Google 表單的 10 個專業問卷調查設計秘密教學

Google 表單自動關閉回覆教學:時間人數到達就過期

執行優先於整理,不要憑空設計系統:以我的防彈筆記法實踐為例