Omnigraffle作為工具，可以有多種用途。不過今天我們要探索如何用它來畫線框圖。 我用過各種線程圖工具，總體上來說，Omnigraffle并不算完美，但就對我工作而言，它性能和效率總體表現(xiàn)最佳。

它最大的問題是不具備很好的原型交互功能。 你最多可制作出能點(diǎn)擊的原型圖，僅此而已了。 你也可以顯示或隱藏圖層，不過只能在Ominigraffle應(yīng)用內(nèi)才能生效。

其他的缺點(diǎn)就是只能在Mac平臺(tái)上使用。

如果不考慮這些缺點(diǎn)的話，Omnigraffle是個(gè)超棒的線框圖制作工具。 我們將深入了解這個(gè)程序，看看Omnigraffle功能有多強(qiáng)，我們怎樣結(jié)合stellar來制作線框圖。

界面

下面是一些我們將在教程中看到的元素： 如果你對其他元素有興趣想進(jìn)一步了解的話，你可以在后面留言給我，我將盡力為您提供相關(guān)信息。

畫布和圖層工具欄

模板(Stencils)窗口

監(jiān)控器。 樣式編輯器 填色

邊框？

陰影

圖片

文本

對齊/屬性

交互

畫布和圖層

畫布和圖層邊欄是用來查看你所有文檔和其內(nèi)容的組織結(jié)構(gòu)。 它們可以展示內(nèi)容和層級(jí)結(jié)構(gòu)，幫助你輕松管理和組織頁面。

在畫布上你可以建立多個(gè)頁面。 可以容納各種所需的內(nèi)容。 我通常先建一個(gè)封面頁，一些流程圖，再加一些用戶信息，還我希望解決的問題。 然后再開始真正創(chuàng)建線框圖。

一個(gè)畫布里可以放置多個(gè)層。 如果你很熟悉Photoshop或者Illustrator，那么Ominigraffle里的層和它們是一樣的。 在層里面，你就可以組織或隨意放置一個(gè)個(gè)的元素。 層可以上下切換順序，這樣你就可以用你需要的方式來管理頁面結(jié)構(gòu)。

你是否需要在多個(gè)頁面中放置同樣的菜單欄，頁面背景，或者是頁面底部內(nèi)容？ 那可以用一個(gè)共享層。 共享層可以直接復(fù)用在不同的畫布上。 調(diào)整也很方便，如果你修改了共享層，所有使用了這個(gè)共享層的畫布都會(huì)同步生效。

不過，請記住，共享層會(huì)出現(xiàn)在不同畫布相同的位置上。 如果你不希望這樣，可以使用后面會(huì)提到的共享對象解決。

圖形和文本

圖形

畫線框圖時(shí)，圖形是最重要的工具。 我最常使用的是長方形、圓形和三角形這些基本圖形。 用基本圖形來構(gòu)建頁面，可以直觀地看到頁面效果。 和畫肖像不同，做線框圖的時(shí)候基本圖形和文本以外的東西幾乎用不上。

對圖形來說，你可以改變幾種屬性。

填充色

實(shí)際形狀和邊框(顏色、邊框尺寸等等)

陰影

幾何屬性

你可以把圖形設(shè)為你最喜歡的圖形。 這樣當(dāng)你需要反復(fù)使用相同樣式的圖形時(shí)會(huì)更加方便。 只需要選中你需要的圖片，然后再在圖形菜單中選擇“增加當(dāng)前選擇到最喜歡的樣式”即可(在最新版本中，右鍵選擇即可)。

文本

你可以在圖形中增加文本，然后對齊。 這時(shí)，文本就成為這個(gè)圖形的一個(gè)性，移動(dòng)圖形時(shí)文本也會(huì)跟著移動(dòng)。

你可以直接使用單獨(dú)的文本。 除了常規(guī)使用以外，當(dāng)你需要在一個(gè)圖形中放置多個(gè)文本的話，這樣也會(huì)比較方便(？)

文本有許多常用的設(shè)置工具。 Omnigraffle是一個(gè)設(shè)計(jì)工具，設(shè)置留白、緊縮、首行空格這樣屬性也非常方便。

Stencils和模板

Stencils和模板可以為您提供可供直接復(fù)用的元素。 模板是個(gè)現(xiàn)成的文檔，你直接填東西就好。 我自己有個(gè)單獨(dú)的工作模板，不過Omnigraffle預(yù)裝的模板也很不錯(cuò)。 當(dāng)然，自己建模板也很方便。 Stencils是一個(gè)預(yù)先設(shè)置好樣本的元素庫，象按鈕、文本、圖標(biāo)、或者是其他的單個(gè)元素，你可以用在自己的線框圖里。

你也可以編輯Stencils和模板。 如果是Stencils，你只需要點(diǎn)擊Stencil，在頂部的菜單里點(diǎn)擊"編輯Stencil". 應(yīng)用會(huì)打開這個(gè)Stencil，你可以象編輯其他Omnigraffle文檔一樣編輯Stencil. 模板也一樣，你也可以象編輯其他Omnigraffle文檔一樣編輯模板。

你可以創(chuàng)建自己的Stencils，也可以直接從網(wǎng)上下載現(xiàn)成的Stencils. 我用過Graffletopia.com網(wǎng)站提供的一些Stencils. 我通常用在特別用途，比如簡筆畫或者移動(dòng)端元件。 下面集合里提供絕大多數(shù)常見的元素：

你可以用這些現(xiàn)成的元素快速創(chuàng)建非常棒的線框圖。

共享對象

這有幾件怪事。

長久以來，我覺得Omnigraffle沒有共享對象是一個(gè)最大的缺陷，雖然Omnigraffle實(shí)際上確實(shí)是有這么個(gè)東西。 問題是創(chuàng)建和編輯共享對象的方式不管怎么說都不夠突出。 絕大多數(shù)情況下，用共享層就夠了。不過偶爾會(huì)遇到你想用共享層，但位置卻并不一樣的情況。 這時(shí)用共享層就搞不定了。 我們該學(xué)習(xí)怎樣來創(chuàng)建共享對象吧。

先創(chuàng)建你的對象(物體) 對象你要多復(fù)雜就可以設(shè)計(jì)成多復(fù)雜的。 將所有需要的元素編成組，然后創(chuàng)建一個(gè)對象。 選中這個(gè)對象然后在編輯菜單欄下選擇Copy as PDF。

詭異的事情發(fā)生了 你先將原來的刪掉，然后粘貼。 雙擊群組對象然后進(jìn)入編輯模式。 這時(shí)會(huì)打開一個(gè)新Omnigraffle文檔。 不用管它，在新打開的文檔里編輯然后保存。 然后關(guān)掉文檔回到你原來的界面下。 這時(shí)你會(huì)看到剛才的改動(dòng)已經(jīng)在你粘貼到文檔里的實(shí)例上全部生效。

對齊和文檔屬性

有些事和線框圖的制作關(guān)系不大，但注意對齊絕對會(huì)讓你輕松很多。 包括：對齊、空格，還有畫布屬性。

對齊就是我用得最多的 點(diǎn)擊需要對齊的邊、角、或者圖形中央，然后點(diǎn)擊水平和垂直對齊按鈕。 就會(huì)與被選中的物體對齊。 需要注意的時(shí)，第一個(gè)被選中的物體就是需要被對齊的對象。

空格元素也很重要 。 設(shè)置間隔距離，然后將選中的對象按距離隔開。 不過，我做得更多只使用快速平均間隔按鈕。 對所有被選中的元素，從第一個(gè)到最后一個(gè)物體實(shí)現(xiàn)平均分布。 只要在你設(shè)置的最大范圍兩邊放置兩個(gè)物體，然后選中所需要對齊的物體，點(diǎn)擊對齊按鈕就可以。 瞬間完成有木有！ 所有元素都完美、平均的排列好了。

在我看來通常情況下，缺省設(shè)置里，畫布屬性的度量單位通常是英寸。 在數(shù)字編輯時(shí)，這不是非常方便，所以可以把它改成像素。 最好是在你自己的模板里設(shè)置好。 選擇所有的畫布，然后將長度單位改成像素。 也可以改成別的測量單位。

交互

如果你只想做一些基本的交互，Omnigraffle也是可勝任。 選中你想進(jìn)行交互的元素，然后在檢查器里的“屬性”卡中打開(譯譯者注：6.4版本中)。 點(diǎn)擊時(shí)可以實(shí)現(xiàn)如下效果：

打開一個(gè)鏈接

打開一個(gè)文件

運(yùn)行一個(gè)腳本

跳到別的地方

顯示/隱藏圖層

我只使用過打開鏈接和跳到別的地方功能。 跳到別處這個(gè)效果比較有用，線框圖有點(diǎn)象可點(diǎn)擊的原型，可以實(shí)現(xiàn)從這個(gè)畫布跳到別的畫布。

警告：在PDF中我從來沒有使用過顯示/隱藏圖層選項(xiàng)。 這個(gè)功能只在Omnigraffle的交互模式下才有效(按下B鍵)(也稱動(dòng)作瀏覽工具)。

結(jié)論

Omnigraffle是一個(gè)很棒的工具，許多設(shè)計(jì)師天天都在用。 可以用很少的時(shí)間快速創(chuàng)建效果不錯(cuò)的線框圖。

如果你已經(jīng)是用戶體驗(yàn)師，或者還在尋找一款線框圖制作工具,Omnigraffle值得一試。 同樣，如果有什么問題或建議可以在下面留言，我將盡量提供幫助。 祝線框圖制作順利。

總結(jié)

以上是生活随笔為你收集整理的omnigraffle 画曲线_Omnigraffle画线框图的新手操作指南的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。