Sneakpeekit:來一份空白的 Grid 吧

雖然目前有很多線上工具可以幫助我們在設計的時候,讓設計團隊透過這些工具來討論接下來的工作方向,其功能強大,甚至從最簡單的 Wireframe 線框到包含互動的 Prototype 原型都可以一站全包,像是 UXPIN。但有時候我們在和客戶或企劃討論設計方向時,所處的環境比較簡易,或者並不允許連線,這時我們通常會隨手拿起身邊的紙筆,直接在紙張上討論並畫出基本的草圖,確認彼此的想法是否一致。

空白的紙張雖然很方便,但它有個小小的缺點,那就是我們比較難去精準地示意畫面上的各種尺寸關係,造成雙方在討論的時候,有可能因為彼此對草圖認知上的差異而有不同的解釋,尤其是 RWD 這類在不同設備下會有不同編排的設計,對尺寸的要求會比較敏感,如果雙方可以在一份規劃良好的 Grid 下討論,對初期畫面結構上的確認會更有幫助。這時,一份印好 Grid 的紙張就會是更好的討論工具。

什麼是 Grid?

Grid 的中文是網格的意思,它有點類似我們小時候寫作文時購買的稿紙,上面印有固定大小的方格,小朋友只需要順著方格將字填入,寫出來的文章就會整整齊齊。同理,網站或 APP 的 Grid 就是指網頁或 App 在規劃的時候,可以依循固定尺寸的方框或小點去安排畫面,設計師們只要透過 Grid 設計畫面,畫面自然就會有一種井然有序的結構感,就像是一把隱形的尺。只是這個 Grid 不一定會在最後完成的畫面上看到,因此,在設計初期設計師與客戶或企劃在進行討論的時候,會更喜歡使用這種印有 Grid 的紙稿。

Sneakpeekit 登場了

其實 Sneakpeekit 提供的內容很簡單,它就是包含各種已經設計好的 Grid 版型。作者 PASQUALE VITIELLO 本身就是一名 UX 設計師,執案的時候也會有 Grid 的需求,所以在設計這份檔案的時候已經設想過 Grid 可能的使用情境,裡面提供七種 A4 尺寸的 Grid 版型,格式是常見的 PDF,你只要下載並列印出來就可以使用,內容含跨常見的寬尺寸 Grid 版型、網頁、平板及手機,且都附上相關設備的外框。另外,每種設備還提供 2UP 及 4UP 的規格,方便我們對網站或 APP 的互動流程進行更細緻的討論。作者以 CC BY-NC-SA 4.0 授權的方式釋出,你可以在其規範下合理的使用它。

推薦使用 Sneakpeekit 的理由

  1. 它非常精美
  2. 可以對網站或 APP 的草圖做更精準的討論。
  3. 內含 2UP 及 4UP 的版型,方便我們討論多畫面的互動流程
  4. 包含常見的設備線框,像是瀏覽器、平板及手機。
  5. 文件的標示清晰,日後方便歸納及整理。
  6. 只要有一台印表機,要印多少都可以自己決定。

如何下載?

你可以透過 Sneakpeekit 直接下載你需要的版型。

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *

Scroll to top