作為一個(gè)網(wǎng)頁(yè)設(shè)計(jì)師，很難保持組織。您不僅可以同時(shí)平衡多個(gè)項(xiàng)目，而且您可能面臨緊迫的時(shí)間和苛刻的客戶。你也可能從品牌反彈到品牌，不得不不斷學(xué)習(xí)新的品牌指南和風(fēng)格。

幸運(yùn)的是，有很多方法可以讓您的工作流程更有效率。為了幫助，我把這八個(gè)提示放在一起，讓你在網(wǎng)頁(yè)設(shè)計(jì)生涯中保持清醒

1.保持您的文件組織

你可以做的最簡(jiǎn)單的事情之一，保持你的理智是保持你的文件有組織。創(chuàng)建和維護(hù)一致的文件夾結(jié)構(gòu)將使您輕松找到您的文件。當(dāng)您構(gòu)造一個(gè)文件夾與另一個(gè)文件夾不同時(shí)會(huì)出現(xiàn)問題，因此找到Final-Final-logo.ai文件是一個(gè)挑戰(zhàn)。

在組織文件時(shí)，一致的文件命名約定是必不可少的。這是版本化的地方。一些設(shè)計(jì)者使用日期，其他設(shè)計(jì)者使用版本號(hào)，一些使用輪次。這將取決于您的行業(yè)和您的個(gè)人喜好，但這是一個(gè)好的做法。由于版本控制，您可以輕松跟蹤哪個(gè)文件是最新的，特別是如果您保存了舊版本以供參考。

我通常保持兩到三個(gè)舊版本，以防客戶想要回到第一輪的英雄戰(zhàn)略，或者更喜歡你的移動(dòng)治療從第二輪。為了避免包大鼠的心態(tài)，它是很好歸檔或刪除舊的文件，以防止您的硬盤驅(qū)動(dòng)器陷入困境。

一致的文件夾結(jié)構(gòu)和命名約定與版本控制的組合也將有助于搜索能力。例如，如果您從具有品牌名稱或縮寫的一個(gè)品牌啟動(dòng)您的所有文件名，您可以更容易地過濾該品牌的資產(chǎn)。這將有助于區(qū)分“ATT-logo-final.ai”與可能是“l(fā)ogo-final.ai的海”的可能。

2.了解您的框架

有一件事，我沒有學(xué)會(huì)，直到幾年我的設(shè)計(jì)生涯是如何正確利用現(xiàn)有的框架。在框架世界中的兩個(gè)重?fù)羰帜壳笆荁ootstrap和Foundation，但Google的Materialise肯定會(huì)給他們?cè)诓痪玫膶?lái)他們的錢。我工作的公司使用Foundation為他們的大多數(shù)品牌網(wǎng)站。

Foundation提供了一個(gè)內(nèi)置的響應(yīng)式網(wǎng)格，以及按鈕，字段，排版，導(dǎo)航等樣式，以及許多其他功能，使您的生活更輕松。通過在您的PSD中利用Foundation的內(nèi)置網(wǎng)格，您將使開發(fā)人員更容易以更像素完美的方式實(shí)現(xiàn)您的設(shè)計(jì)，而不是如果你做自己的事情。 Photoshop有這個(gè)漂亮的指南布局工具，不僅使創(chuàng)建網(wǎng)格輕而易舉，而且將他們附加到藝術(shù)板，以方便文件重組和移動(dòng)。

基金會(huì)備忘錄截圖

框架還為按鈕樣式，表單等提供了一個(gè)良好的起點(diǎn)，并幫助展示了您可以實(shí)現(xiàn)的設(shè)計(jì)策略的可能性和局限性。這不僅會(huì)為您的設(shè)計(jì)提供一個(gè)偉大的起點(diǎn)，但它將有助于促進(jìn)與您的開發(fā)人員的友好協(xié)作。

3.按內(nèi)容部分組織您的圖層

當(dāng)你處理復(fù)雜的網(wǎng)頁(yè)設(shè)計(jì)PSD有這么多的文件夾，層，智能對(duì)象等，它很容易弄亂的東西。一旦層2,455來(lái)臨，你開始意識(shí)到你需要在你的PSD內(nèi)的某種組織。這就是為什么我建議組織你的PSD的部分。

礦井通常包括文件夾，其中包括Nav，Hero，簡(jiǎn)介，包，優(yōu)惠，頁(yè)腳等。我也彩色代碼這些文件夾彩虹的方式，所以他們很容易導(dǎo)航。這使得更新部分和重做您的PSD很容易。

我組織我的文件到部分文件夾彩虹色編碼，輕松掃描能力。

例如，如果你需要使英雄部分更大，你可以輕松地拖動(dòng)所有下面的文件夾作為一個(gè)單位（控制命令），然后在更新后將它們拖回來(lái)。此策略還有助于開發(fā)人員和其他設(shè)計(jì)人員輕松瀏覽您的文件。通過使用可理解的名稱，如“Hero”和“Nav”，一個(gè)新的設(shè)計(jì)師可以輕松地跳轉(zhuǎn)到該文件夾，并做出他們需要的任何更改。

一些設(shè)計(jì)師甚至?xí)玫矫麊为?dú)的圖層，這也可以是非常有益的，但可能會(huì)有點(diǎn)費(fèi)時(shí)。由于圖層在設(shè)置為“圖層”時(shí)通過自動(dòng)選擇工具很容易找到，因此很容易得到單獨(dú)的圖層，所以這是由個(gè)人設(shè)計(jì)師如何組織他們的圖層。關(guān)鍵是你已經(jīng)做完了。

4.記住您通常使用的所有鍵盤快門

這是一個(gè)大的效率。如果你發(fā)現(xiàn)自己定期使用一個(gè)特定的鍵盤命令，記住它。如果您將所有主鍵盤快捷鍵都關(guān)閉，您將以指數(shù)方式提高效率。

一些重要的是保存，字體大小和領(lǐng)先，圖層排序，保存為Web和不透明度等等。 Photoshop也讓你能夠創(chuàng)建自定義快捷方式。在我的書中，記住的最重要的命令是保存您的文件。由于Adobe的隨機(jī)崩潰，它是很好的經(jīng)常保存的一面，而不是冒失去任何進(jìn)展的風(fēng)險(xiǎn)。

Adobe提供了在“編輯”>“鍵盤快捷鍵”下自定義鍵盤快捷鍵的選項(xiàng)

快捷方式還可以通過內(nèi)容部分文件夾來(lái)組織圖層（如上所述）。使用鍵盤快捷鍵將圖層放到文件夾的頂部和底部比在無(wú)組織文件中重新排序圖層更容易。這是在你設(shè)計(jì)的時(shí)候組織你的文件的地方。記住經(jīng)常使用的鍵盤快捷鍵并保持圖層的有序化將大大提高您的效率，并幫助其他設(shè)計(jì)師使用您的文件。

5.使用CC庫(kù)

Adobe創(chuàng)建CC之后添加的最好的事情之一是圖書館。如果你沒有聽說過他們，你需要查看這個(gè)驚人的教程如何使用它們。

我覺得每個(gè)設(shè)計(jì)團(tuán)隊(duì)都應(yīng)該利用這個(gè)驚人的功能。庫(kù)允許您使用資源（如顏色，字體樣式，照片，圖標(biāo)和符號(hào)（如頁(yè)眉和頁(yè)腳））創(chuàng)建品牌庫(kù)。借助圖書館，您可以使用單一品牌庫(kù)輕松與多個(gè)組織的廣告素材協(xié)作。

庫(kù)可以輕松更改顏色和更新文本樣式，只需點(diǎn)擊一個(gè)按鈕。它們還幫助存儲(chǔ)可以在一個(gè)地方輕松更新的品牌圖標(biāo)，并通過PSD快速反映更新。這對(duì)您的網(wǎng)站的頁(yè)眉和頁(yè)腳非常有用，您可能會(huì)在整個(gè)項(xiàng)目中進(jìn)行小更新。

我也使用CC庫(kù)在我的設(shè)計(jì)的字體樣式。我將為桌面，平板電腦和移動(dòng)應(yīng)用程序設(shè)置英雄副本，標(biāo)題，副標(biāo)題，正文副本，免責(zé)聲明等的樣式。關(guān)于視圖切換，由于其容易的掃描能力，我發(fā)現(xiàn)自己使用列表格式比瓦片視圖更多。

圖書館也非常適合團(tuán)隊(duì)協(xié)作。您可以選擇與其他廣告素材協(xié)作，以便他們可以編輯并添加到庫(kù)中，也可以共享庫(kù)鏈接以便于訪問。他們還有一個(gè)“從文檔創(chuàng)建新庫(kù)”功能，但我更喜歡自己創(chuàng)建庫(kù)，所以它保持有組織，只有最相關(guān)的資產(chǎn)。

不幸的是，圖書館有幾個(gè)缺點(diǎn)，其中之一是缺乏文本的單獨(dú)的字符和段落樣式。我通過在不同的框中應(yīng)用我的字符樣式，然后將不同的樣式粘貼到一個(gè)框中，使文本框更容易在文件中管理。另一個(gè)缺點(diǎn)是，你目前不能在全局更新字符樣式。目前，在庫(kù)中沒有組織能力在類別（顏色，字符樣式等）內(nèi)創(chuàng)建子文件夾，但希望Adobe也在這方面努力。

CC庫(kù)目前的工作方式是，最近更新/添加的資產(chǎn)將顯示在頂部。 CC庫(kù)顏色不能應(yīng)用于文本框中的單個(gè)文本，并且只能輕松應(yīng)用于形狀和整個(gè)文本框。我相信Adobe在努力解決這些問題，所以我不是太擔(dān)心，尤其是因?yàn)閷I(yè)人士絕對(duì)勝過的缺點(diǎn)。

6.保持智能對(duì)象格式中的圖像和矢量

即使它會(huì)使您的文件更大，保持您的圖像和向量在智能對(duì)象格式將使以后的設(shè)計(jì)師更容易編輯您的PSD。照片：客戶回來(lái)編輯，包括重新剪切英雄照片和小調(diào)整到矢量圖標(biāo)。如果PSD包括全分辨率照片而不是較小的光柵化版本，則這更平滑地完成。當(dāng)它們是來(lái)自Illustrator的智能對(duì)象而不是光柵化圖形時(shí)，向量也很容易調(diào)整。

以智能對(duì)象格式照片的另一個(gè)好處是，當(dāng)您將它們保存為PSD，然后將它們作為智能對(duì)象放入您的文件。使用已放置的照片PSD可以輕松地在單獨(dú)的包含照片文件中添加調(diào)整圖層和編輯，而不是混亂您的源文件。利用智能對(duì)象作為圖形庫(kù)圖形，您可以獲得更多的獲勝組合。您不僅可以輕松地編輯矢量對(duì)象，而且?guī)靾D形將在所有應(yīng)用程序中更新。

7.創(chuàng)建一個(gè)風(fēng)格指南并貼到它

很多品牌將有一個(gè)一般的風(fēng)格指南，你可以跟隨它，當(dāng)涉及到字體，顏色，照片，圖標(biāo)，插圖等。這是有用的資源，但不會(huì)總是讓你一致的網(wǎng)站特定的樣式。我通過為我工作的每個(gè)特定網(wǎng)站創(chuàng)建Web風(fēng)格指南，大大提高了我的效率。

有時(shí)品牌會(huì)有多個(gè)不同風(fēng)格的網(wǎng)站，所以我確保每個(gè)網(wǎng)站都有一個(gè)網(wǎng)站，所以我在設(shè)計(jì)時(shí)可以保持一致。當(dāng)我需要按鈕，圖標(biāo)，插圖，照片等時(shí)，這也創(chuàng)造了一個(gè)容易的拖放資源。這不僅將使你作為一個(gè)設(shè)計(jì)師更有效，但它將幫助你在整個(gè)網(wǎng)站的樣式保持一致。

在部分之間使用什么間距？查看樣式指南！什么是主按鈕顏色和填充？從樣式指南抓住它！這也將幫助其他設(shè)計(jì)師輕松地跳躍現(xiàn)場(chǎng)設(shè)計(jì)輕松和有效率。如果你合并使用CC庫(kù)與風(fēng)格指南，你甚至更先進(jìn)的游戲。

7樣式指南

我為所有不同的品牌創(chuàng)建一個(gè)PSD風(fēng)格指南，我工作，所以我可以輕松地抓住元素，如按鈕和圖標(biāo)。

許多設(shè)計(jì)師都試圖每次在設(shè)計(jì)中面臨新的問題時(shí)添加新的風(fēng)格。為了一致性，最好避免這種情況，并始終堅(jiān)持在您的風(fēng)格指南中建立的標(biāo)準(zhǔn)。如果您添加新的圖層和樣式，請(qǐng)確保它們應(yīng)用于整個(gè)網(wǎng)站。

創(chuàng)建的新風(fēng)格越多，未來(lái)的設(shè)計(jì)就越復(fù)雜，新設(shè)計(jì)師就越難以進(jìn)行項(xiàng)目并保持設(shè)計(jì)的一致性。在許多情況下，一致性比持續(xù)創(chuàng)新在用戶體驗(yàn)方面更重要。即使在項(xiàng)目開始時(shí)創(chuàng)建Web風(fēng)格指南可能需要更多的時(shí)間，它將提高您以后所有頁(yè)面的效率。

我從布拉德弗羅斯特學(xué)到的一個(gè)最佳實(shí)踐是在設(shè)計(jì)過程中或在將要使用的現(xiàn)有網(wǎng)站上執(zhí)行界面清單。界面清單包括通過截屏收集所有不同的文本樣式，按鈕樣式等，并編譯它們以發(fā)現(xiàn)不一致。然后，您可以向客戶介紹您的發(fā)現(xiàn)，以提出更新和改進(jìn)。

由于網(wǎng)站觸及多個(gè)設(shè)計(jì)師，他們的存在的情況下，事情可以在一致性部門相當(dāng)毛。一旦您為網(wǎng)頁(yè)上的元素找到統(tǒng)一的設(shè)計(jì)風(fēng)格，請(qǐng)務(wù)必更新您的風(fēng)格指南，以便每個(gè)人都是最新的。

8.積極參與部門間合作

許多追求職業(yè)生涯的人（設(shè)計(jì)師，開發(fā)人員，撰寫人等）傾向于內(nèi)向，所以當(dāng)談到協(xié)作時(shí)，很難走出你的舒適區(qū)。它也很難離開你的專業(yè)泡沫，特別是當(dāng)它更容易與你的領(lǐng)域的人相關(guān)。即使它有時(shí)可能是尷尬或不舒服，留下你的泡沫和定期與其他部門的人合作可以大大提高您的設(shè)計(jì)的質(zhì)量和效率。

這方面的一個(gè)主要例子是當(dāng)設(shè)計(jì)師和開發(fā)人員合作重新設(shè)計(jì)時(shí)。您應(yīng)該事先與開發(fā)人員會(huì)面，了解他們使用的框架，了解網(wǎng)格系統(tǒng)，并評(píng)估可能性。當(dāng)設(shè)計(jì)工作完成后，請(qǐng)確保共享您的Photoshop庫(kù)，以便開發(fā)人員可以輕松地訪問調(diào)色板，字體樣式等。這也有助于提前共享風(fēng)格指南，以及任何組件設(shè)計(jì)給他們一個(gè)良好的開端。

與您團(tuán)隊(duì)中的其他設(shè)計(jì)師合作使用庫(kù)還將幫助您保持一致性和更高效。讓藝術(shù)總監(jiān)或大多數(shù)高級(jí)設(shè)計(jì)師對(duì)圖書館和風(fēng)格指南更新負(fù)責(zé)，將消除混亂，保持品牌的一致性。只要確保在進(jìn)行更新時(shí)有一條通信線，以便每個(gè)人都在同一頁(yè)上。