可以減輕您在設計中的“科學”負擔的應用程序

已發表: 2015-10-23

網頁設計師最不喜歡的是什麼? 應該是編碼吧。 也許緊隨其後的是所有設備的原型設計。 任何能讓這些事情變得更容易的東西都可以讓設計師把更多的時間花在作品的創意方面。

考慮到這一點,每個設計師都應該探索許多很棒的新應用程序,作為他/她的工具包的潛在補充!

前衛

多麼棒的網站,您可以創建自己的風格指南並將它們存儲在雲中以供將來參考和共享。 有用於徽標和圖像、調色板、排版、圖標以及您自己的文本和媒體的樣式指南模板。 這裡的另一個大優點是您不必手動創建自己的 PDF 樣式指南——您將它們存儲在 Frontify 上,它們可以轉換為 PDF 文件以供下載、打印和共享。 版本控制將所有舊版本保留在後台,以便隨時啟動。 您可以從他們的模板開始,或者研究品牌書籍示例來定制您自己的模板。 所有功能都可以通過 API 訪問。 這是一個使用 Frontify 自己的徽標的示例:

FRONTIFY

這是基本標誌。 Frontify 認為“水滴”是這裡的關鍵,但它們可以做很多其他事情,仍然保持標誌的一致性。 以下是顏色變化:

FRONTIFY

以下是基本徽標變體的示例:

FRONTIFY

這只是可用於創建獨特樣式指南的設計和顏色模板的一個示例,所有組件都是可互換的。

視覺作曲家

這個應用程序已經存在了一段時間,您可能已經知道它,但是您很難找到另一個帶有設計選項包的應用程序。 它基本上帶走了計劃和編碼的艱鉅任務。 您可以在幾分鐘內完成設計佈局,只需單擊一下即可添加元素。 25 美元的價格標籤非常值得。 一切的按鈕; 許多動畫選項,即時共享選項等等。 這個寶貝有超過40個內容元素! 它真的是一個萬能的工具! 如果您不確定它的所有功能以及如何使用此應用程序,請查看此處的視頻教程。

VISUAL COMPOSER

有一些很棒的功能可以讓您非常快速地設計您的頁面,並且您可以修改幾乎任何元素。 例如,您可以修改幾個預定義的網格元素或設計自己的網格的選項。

如果 Visual Composer 有一個缺點,那就是它會在您停用時留下很多小代碼,在開始新主題之前必須將其刪除。 這是通過 Visual Composer 創建的設計示例。

VISUAL COMPOSER

設計狩獵

DESIGN HUNT

當您的靈感剛剛停滯時,您可能會通過搜索可以為您提供好主意的新網站來尋求它。 這可能是一項耗時的任務,那麼為什麼不使用更方便的方法呢? Design Hunt 是一種“票據交換所”,但它每天都會改變其全部曲目。 它在 Pinterest、Dribble、Designer News、DesignInspiraton 等網站上繪製了很棒的新設計,並將它們發布給正在尋找新靈感和想法的設計師。 現在,您可以每天去一個地方找到一個全新的收藏。

TOOKAPIC

TOOKAPIC

作為庫存照片業務的一個相對較新的公司,Tookapic 現在擁有超過 11,000 張庫存照片,其中大部分是免費的,其餘的則以低價出售。 您可能真的比您現在使用的庫存照片源更喜歡它——非凡的色彩和清晰度以及真正獨特的照片。 訪問他們的網站並查看他們擁有的內容。 你可能會感到驚訝!

MARVELAPP

這個免費的原型製作工具允許您從您的手機或任何其他設備繪製和創建模型,並立即看到原型。 從那裡,您可以重新排列、修改、添加顏色、文本、更改表格以及執行幾乎任何操作,並立即與任何設備兼容。 為項目命名後,立即進入主界面並開始。 完成後,您可以預覽整個設計並與之交互以確保一切正常。

MARVELAPP

要了解有關此非凡工具的更多信息,請訪問該網站並觀看演示 - 您會對它的易用性感到興奮。 最好的功能之一是能夠從任何地方(甚至 Dropbox 和草圖)和任何圖像類型放入圖像。 如果這是一個協作項目,您還可以添加一個團隊。 Marvel最大的缺點是免費版本有限制,所以你肯定需要升級。 儘管如此,它還是超級容易使用——每一點都和 Justinmind 一樣好。

動畫 CSS

如果你製作了很多動畫,你肯定會想要這個工具。 非常酷的功能,無需編寫任何代碼。 有一個現成的動畫效果庫 - 實際上超過 50 個 - 您可以輕鬆自定義循環次數和持續時間。 只要您不過分,動畫就會增加極大的參與度和娛樂性!

但是,如果您正在尋找一組真正完整的功能和選項,那麼僅靠 CSS 並不能滿足要求。 雖然關於 CSS 和 JavaScript 的爭論肯定還在繼續,但肯定有一些方法可以將它們一起使用。 例如,您設計了一個很棒的 CSS 動畫,但您希望它在用戶向下滾動到某個點時從左側滑入。 您必須添加 JS 才能完成。 理解 CSS 有其局限性並且可以通過 JS 來增強只是明智地使用可用的工具。

ANIMATE CSS

儘管如此,Animate CSS 確實很容易運行。 您下載它,附加 CSS 以及 jQuery 和您想要的任何其他組件並開始製作動畫。 YouTube 上有很棒的教程可以幫助您入門。

冷卻劑

如果您碰巧是色盲或只是對配色方案有挑戰,此工具將為您開發一個完整的配色方案,或者如果您知道要從哪裡開始創建一個。 當您發現您喜歡的顏色時,將其鎖定,然後繼續單擊 - 您將獲得一個完整的方案,其中包含您想要的多種顏色。 如果您想使用顏色漸變,這將特別有用。 這個工具沒有什麼真正的爭議——使用它的設計師喜歡它; 那些還沒有嘗試過的人。 唯一的缺點? 它不再免費,您必須擁有 iTunes 帳戶才能下載。

COOLORS
顏色挑戰的自動配色方案生成器

CIRCULUS.SVG

這不是一個包含大量選項、模板等的綜合工具,但這是一種設計菜單的獨特方法,或者在任意數量的頁面上設計多個菜單! 您所要做的就是在菜單中輸入您想要的具體內容。 然後,您將獲得有關如何構建它並將其嵌入特定頁面的詳細說明。

CIRCULUS.SVG
更好地吸引遊客的小事

在創建這種元素方面,圓形 SVG 可能優於 CSS。 下載後,您有 3 個選項: 您可以在圖形編輯器中繪製扇區,例如 Sketch,然後將它們導出為 SVG,添加交互並嵌入它們; 你可以用代碼畫出你的扇區; 或者您可以直接在應用程序中使用 Circulus 生成器。

CSS 允許您創建循環導航,但存在一些瀏覽器錯誤,而且工作量很大。 你必須從一個矩形開始,把它分開,然後傾斜和旋轉這些部分。 而且,如果您在扇區中使用的不僅僅是圖標,它就會變得更加棘手。

使用 SVG,你可以繪製任何你想要的形狀,使用特定的線條和弧線命令到你想要的“餅楔”——這裡有一個例子:

CIRCULUS.SVG

一旦您繪製了每個楔形並嵌入了您的圖標和/或內容,您只需加入它們即可。

元翻牌

厭倦了相同的舊字體和字母樣式? 創建您自己的 - 無需編碼 - 只需單擊並拖動。 更改為獨特的字體和文本樣式可能會鼓勵訪問者實際閱讀內容! 這個應用程序太酷了,你將很難玩幾個小時。 你再也不會說排版是網頁設計中最不性感的部分了。

就是這麼簡單。 您可以從一系列具有不同特徵(高度、光圈和對比度)的幻燈片中自定義字體。 你調整直到你有你喜歡的,然後下載它作為一個網絡字體包(免費)。 還有一個預建字體庫可供選擇。 繼續玩——你會明白為什麼字體設計師可能是“垂死的品種”。

METAFLOP
用獨特的字體和样式吸引註意力

字體

FONTFLAME

這真的是一個“新來的孩子”。 Fontflame 試圖為設計師減輕一項負擔——尋找真正有效的字體配對。 目前,它在其網站上有 10 個已發布的配對,但每天都在增加。 使用 Google 的免費字體庫的配對示例包括“Lobster-Asap”和“Roboto-Open Sans”。 其他庫將很快添加。 密切關注這個網站——它很快就會在配對中提供很多東西。

自由職業者播客

FREELANCER PODCAST

不是應用程序或工具 - 這是您不想錯過的設計師和開發人員每周播客。 由 Paul Jarvis 主持,您將獲得新趨勢、應用程序和工具,以及許多非常實用的建議。

視覺內

這是一個很棒的原型製作工具,它具有其他一些功能中沒有的功能。 像所有其他人一樣,您可以為任何或所有設備創建模型——您可以選擇您想要的。 創建原型後,您可以在所有設備上進行預覽,然後將其發送給客戶或團隊成員進行審核。 他們可以對設計本身發表評論,這是一個巨大的優勢。 In-Vision 的另外兩個不錯的功能是歷史模式,它可以讓您查看設計的所有早期版本,以及 3 個演示項目供設計師完成,直到他們對所有功能感到滿意為止。

IN-VISION

在將 In-vision 與 Marvel 應用程序進行比較時,重要的區別可能如下:

  1. InVision 比 Marvel 具有更多功能,但這也使其更加複雜。 例如,它具有更多的實時協作功能、用於註釋屏幕截圖的工具以及出色的歷史元素。
  2. Marvel 有一個 iOS 應用程序,目前正在開發適用於 Android 和 iPad 的應用程序——InVision 沒有這些應用程序。
  3. InVision 可能更適合大型團隊,Marvel 更適合單人或小型團隊。

這兩個應用程序的用戶的評論將更清楚地說明哪個應用程序最適合哪些用途。

您可能有一些其他設計師喜歡聽的最喜歡的應用程序。 告訴我們它們是什麼,以及它們如何讓您有更多時間成為一名藝術家。