轉(zhuǎn)載藍藍設計( www.alimai.net  )是一家專注而深入的設計機構(gòu) ，為期望卓越的國內(nèi)外企業(yè)提供有效的 BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、   網(wǎng)站建設 、平面設計服務

http://article.yeeyan.org/view/195690/171503

從擇色、選圖，到正確使用留白區(qū)域，我們將剖析幻燈片設計的每個環(huán)節(jié)。通覽此文之后，你必能設計出屬于自己的精美幻燈片，令同事們自嘆不如。

A Word About Content

 

I usually make a big deal about content preceding design, and presentations are no exception. Ideally, you’ll have the topic and much or all of the content outlined before you even think about design. This will in every way shape the appearance of your design, which is why working from pre-built templates isn’t always the best move (though generic templates can and do work great in some circumstances).

概括內(nèi)容

通常，我會在設計內(nèi)容導入上下很大功夫，做報告時也是如此。理想情況是，在設計幻燈片之前，你得明晰主題和內(nèi)容大綱。這會決定幻燈片設計的各方各面，也是為什么選用預制模板并非總是最佳方案的原因（盡管在有些情況下，通用模板效果頗佳）。

 

The reason that I bring this up is that I don’t really have an actual presentation in mind for this project. I’ll be running with a basic theme, but the textual information will be entirely placeholder copy. Your image, font, color and layout selection shouldn’t necessarily match mine but instead reflect the topic and content you’re working with. 

我之所以提起這個是因為對此心中并沒有實際的幻燈片方案。我會使用一個基本主題，而文本信息將完全是占位符復制。你選擇的圖片，字體，顏色以及布局無需和我一致，相反，這些應該反映你所要呈現(xiàn)的主題和內(nèi)容。

Choosing A Color Scheme

 

Before I even open Photoshop (yes, I design PowerPoint/Keynote slides in Photoshop and drop them in, thought it helps if you do the te), I want to find a color scheme on which to base my entire design. When I need to quickly find several colors that go together I usually start with Kuler. Not only is it a great way to build your own color schemes, it’s an outstanding source to find schemes built by others that you can just grab for your projects. 

選擇配色方案

即便在我打開Photoshop圖形處理軟件之前（是的，我用Photoshop軟件來設計PowerPoint/Keynote幻燈片，然后再將其導入。如果你試試，便會發(fā)現(xiàn)確實不錯。），我就希望找到一個配色方案來為整個設計奠定基調(diào)。當我需要快速尋找?guī)追N可相配的顏色時，我通常會先使用Kuler色彩工具。這不僅是個建立自己配色方案的好辦法，還是借鑒他人配色方案以作已用的絕佳來源。

 

As luck would have it, I liked the very first color scheme I saw upon opening Kuler. “Keep the Change” was featured on the home page and looked like a great place to start for our presentation design.

說來也巧，打開Kuler所看見的第一個配色方案就令我十分喜歡。主頁上的那句“不斷改變”似乎表明了這能為我們設計幻燈片起個好頭。

 

Now, if you wanted to get everything exactly right, you could make a list of the RGB or Hex values, but I prefer a quicker, more direct route. What I usually do is snap a screenshot of the color scheme, paste it into my document and stretch it across the canvas on its own layer for easy access. This way I can quickly activate the layer, eyedropper the color I want, then hide the layer and get back to work. It’s a bit like having a palette of colors to dip your paintbrush in.

現(xiàn)在，如果你想把一切都做好，那么你可以列一種三原色和顏色數(shù)值表。但是，我更傾向于另一種更為快捷繼而直接的方式。通常我會對配色方案進行截圖，然后將其復制到我的文檔內(nèi)，在將其圖層在畫板上展開，以方便操作。這樣做我便可以很快激活圖層，然后用吸管工具吸取我要的顏色，最后隱藏圖層，接著設計幻燈片。這就像用畫筆蘸著調(diào)色板里的顏料一樣。

 

Designing Your Cover Slide

 

Now that we have a color scheme, the design work is going to be much simpler. One trick that designers often use in presentations is to leverage the color scheme as heavily as possible. If you’re new to design, you’ll likely think that this is too easy, too plain or even that it’s cheating somehow, but trust me, it’ll be much more attractive and professional than that horrid Microsoft clipart library you love so much.

設計首頁

既然已經(jīng)選定了配色方案，接下來的設計工作就簡單的多了。設計者們常用的一個技巧就是盡可能多利用配色方案。如果你是個初學者，你可能會覺得這樣做太過簡單，太過單調(diào)了，甚至會覺得這是在糊弄人。但是相信我，這可比使用你常用的那些糟糕微軟內(nèi)置剪貼畫要更吸引人，更專業(yè)。

To start, simply grab one of your colors from the scheme you chose and flood the background of your slide with it (I chose #631c25). Good job, there’s your background. Don’t freak out. It’ll look great. Now let’s throw in some typography.

既然已經(jīng)選定了配色方案，接下來的設計工作就簡單的多了。設計者們常用的一個技巧就是盡可能多利用配色方案。如果你是個初學者，你可能會覺得這樣做太過簡單，太過單調(diào)了，甚至會覺得這是在糊弄人。但是相信我，這可比使用你常用的那些糟糕微軟內(nèi)置剪貼畫要更吸引人，更專業(yè)。

Choosing a Font

 

Font choice is a major issue for non-designers. The tendency is to think that most fonts are “boring” and to look around for something exciting and fun. This inevitably leads to the use of Comic Sans or some other equally hideous font.

選擇字體

一般人都覺得選擇字體很重要?，F(xiàn)在的趨勢是，人們認為大多數(shù)字體很單調(diào)便轉(zhuǎn)而使用新鮮有趣的字體。這最終使得人們運用漫畫字體和其他同樣奇形怪狀的字體。

 

Unless you’re an elementary school teacher, your presentations should never look like this. Instead, why don’t you try one of those “boring” fonts to see if you can come up with something you like.

除非你是個小學老師，否則你的幻燈片決不能這樣。相反，為什么你不試一下用用這些單調(diào)的字體，看看這能否產(chǎn)生你喜歡的效果呢？

Combining fonts can be a tricky task and can take a trained eye to pull off. Fortunately, font designers have already created collections that work well together and if you’re not a designer, they make it easy to pull off great typography. The trick is to just stay in a family. Again, I know this sounds lame, but it works really well if you make sure the two styles you choose are very different.

混合使用不同字體是個技術(shù)活，只有培訓過的人才能做好。幸運的是，字體設計者們已經(jīng)設計了一些搭配效果不錯的字體集。如果你不是個設計者，那么這些字體集能令你輕松完成出色的排版。技巧是要在同一個字體家族內(nèi)選擇。此外，盡管聽上去不太靠譜，但是如果你確信所選擇的兩種風格是大相徑庭的話，那么它們的混搭效果真的會很好。

For instance, I chose a Helvetica Bold Condensed and a Helvetica Light for my cover slide. Notice how different the fonts are from each other in terms of thickness. Choosing two styles that are relatively close causes visual confusion and should be avoided as a general rule of thumb. Instead, what you want is contrast and plenty of it.

例如，我為首張幻燈片選的字體是 Helvetica Bold Condensed 和 Helvetica Light這兩種字體。注意這兩種字體之間的區(qū)別就在于顏色濃度的不同。通常就經(jīng)驗而言，兩種風格相對接近會引起視覺混淆因而需避免使用。相反，你所需要的是大量運用對比。

Alignment and Layout

 

Notice a few things about the way I set up this slide. First, I used a strong left alignment for the text. As I say in just about every design article I write, center alignment should be a last resort, not a first. It tends to be the weakest text alignment that you can choose, having a hard edge increases readability considerably (notice that book pages aren’t center-aligned).

對齊與布局

注意我設置幻燈片的幾點。首先，我將文本設為左對齊。正如我在所有幻燈片設計的文章里所說的，居中對齊應該是你的最后選擇而非首選。居中對齊是最差的文本對齊方式。排列整齊，邊緣分明的文本會明顯增強其可讀性（注意書頁從不以居中方式對齊）。

Also, notice the generous whitespace that I used. Remember that you don’t have to eat up every inch of space. Giving your text room to breathe helps your layout immensely and gives the design a clean look. 

此外，注意我所使用的空白區(qū)域。記住你并不需要將所有的空間都加以使用。留些空白，讓文本看上去更舒適，這能使你的布局顯得開闊，從而打造整潔的幻燈片設計。

Adding an Image

 

t this point you might be wondering why you wasted your time reading so I could give you such plain advice. The truth is, most people that create presentations could improve them by 100% from following the advice above. However, I realize minimalism may be too extreme for some folks so let’s throw in an image to make it look nice.

插入圖片

現(xiàn)在你可能在想自己為什么要浪費時間來看這些普通的建議。事實是，大多數(shù)設計幻燈片的人都能通過以上建議100%提高自己的設計技能。然而，我意識到對于一些人而言，極簡主義可能走了極端。那么，就讓我們插入些圖片來來幻燈片更漂亮些吧。

Since our text is on the left, I wanted to find something a little heavy on the right. The general theme that I’ll go for is “City photos” assuming I had some sort of architecture or city-centric presentation to give. Again, you’ll have to choose iamges relevant to your own topic.

由于文本在左邊，所以我希望右邊有些顯眼的東西。假設我所做的報告與建筑或城市有關(guān)，那么我會選擇“城市圖片”作為總主題。還是如此，你得選擇和自己主題相關(guān)的圖片。

I grabbed this Flickr Creative Commons image from photographer Ben Spreng. 

由于文本在左邊，所以我希望右邊有些顯眼的東西。假設我所做的報告與建筑或城市有關(guān)，那么我會選擇“城市圖片”作為總主題。還是如此，你得選擇和自己主題相關(guān)的圖片。

Now, if we just made this image our background, the text would become unreadable and we would be ditching our color scheme. What we’re going to do instead is set it on top of the colored slide and set our blending mode to Overlay. Then throw your opacity to around 45%.

現(xiàn)在，如果我們只把這張照片設為背景，那么本文便會無法辨讀，而且我們也會破換配色方案。我們所要做的應該是將圖片放置在幻燈片的頂層，然后將混合模式設為疊加，再將不透明度設為45%左右。

As you can see, this helps the slide look much more interesting but keeps the text and colors fairly intact. It’s a simple solution that adds a lot of interest to an otherwise plain design.

你可以看到，這樣幻燈片看上去更加豐富，但同時又使得文本和各種顏色彼此不相干。這個簡單的方法為原本平淡的設計增添了不少趣味。

Adding Content Slides

 

The cover may seem like it’s only a tiny part of the battle, but you’ve actually already set the tone for the entire presentation. You’ve got your theme, color scheme and fonts already in place. Now you just need to set up a few different layouts for your content. 

插入主體幻燈片

設計幻燈片首頁似乎只完成了整份工作中的一小部分，但是實際上你已經(jīng)為整個幻燈片定下了基調(diào)。你已經(jīng)設定了主題，配色方案和字體?，F(xiàn)在需做的便是為內(nèi)容設定不同的布局。

The thing to keep in mind is to keep everything extremely simple, and that includes the level of content that you include. Apart from design, these are just good presentation tactics that you’ll learn in every public speaking class. Filling your slides with everything you’re going to say makes you unnecessary. You could just email everyone the slides and shut up. 

務必令一切都極簡化，包括選定的內(nèi)容。除了設計之外，這些是你在所有公共演講課堂上會學到的報告技巧。你不必將所有要說的東西都放在幻燈片上，這樣還不如把幻燈片電郵給所有人。

Instead, the slides are merely meant to be a visual aid. Show a slide with your overall topic or main point, then speak the rest, without reading. Nothing is worse than watching a guy read his note cards word-for-word for thirty minutes, except perhaps watching a guy turn his back to the audience so he can actually read his slides out loud to you the whole time! You may laugh, but I’ve seen it happen folks.

相反，幻燈片只是視覺輔助工具。將主題和主要內(nèi)容呈現(xiàn)在幻燈片上，然后表述剩下的內(nèi)容，而非朗讀?？粗粋€人在30分鐘里一字不差地吧要點卡片上內(nèi)容讀出來，或是在整個報告過程中背向觀眾以便大聲讀出幻燈片上的內(nèi)容，沒有是么比這更糟糕了。但是，我的確碰到過這種情況。

For our first content slide, we’ll grab another Flickr photo and set it to the bottom portion of our slide at full bleed. Then we’ll set the top to another color from our scheme and toss in some text using the same exact formatting that we used on the cover. 

我們會從Flickr中選擇另一張圖片放到首張主題幻燈片中，將其以全出血（印刷術(shù)語，印刷圖象超出紙張四邊的部分。由于幾乎沒有印刷機可以在紙張過邊緣進行印刷，幫所有四邊必須裁切掉）方式放置幻燈片底層。接下來從配色方案中選擇另一種顏色，將其置于頂層，然后按照首頁的格式輸入文本。

See how this closely resembles the theme we’ve already established while still looking significantly different? This is they key to good presentation design: cohesiveness without redundancy.

看到了嗎，這就能與我們確定的主題相似同時又明顯有所區(qū)別。好幻燈片設計秘訣就在此：內(nèi)容互相呼應，簡練不冗余。

Now for our third slide, we can simply do the inverse of the second slide with a new color and a new image.

在制作第三張幻燈片時，我們只需將制作第二張幻燈片的步驟反過來，并運用新的顏色和圖片。

Adding Informational Elements

 

It would be nice if every slide ever presented could work in a full bleed image, but the truth is that this simply isn’t practical. It will often be the case that you’re presenting graphical information or some other item that isn’t necessarily a photo.

加入信息元素

如果每張幻燈片都能以全出血圖片的形式呈現(xiàn)，那再好不過。但是這是不現(xiàn)實的。然而通常，你會展示圖片信息或非圖片信息。

My advice here is to try to stick as close to your theme as possible. For the slide below I flooded the entire background with a solid color from our original scheme and made a quick 3D graph with white columns (I drew a few flat boxes in Illustrator and applied a 3D effect). 

對此，我的建議是盡量貼近主題。我會將最初設定的配色方案中的一種純色最為下張幻燈片的背景，然后利用白色方框框很快地制作一張3D圖片（我用Illustrator畫出方框，再添加3D效果）。

As you can see, this slide is very information-focused and yet it doesn’t sacrifice the aesthetics and simplicity we’ve already established.

如你所見，這張幻燈片信息突出，同時頗具美感，簡潔大方，和之前的設計一致。

You’re All Set

 

From here you might come up with one or two more alternate slide designs and then rotate between them for the duration of your speech. The result is a presentation that is beautiful, very readable and highly professional. The bonus is that the simple, straightforward design will probably result in less work than a clip-art-filled horror show.

一切就緒

現(xiàn)在開始，你或許會再做幾張備選的幻燈片，以便在你演講時可以播放。最終你的報告將富有美感，內(nèi)容易讀，而且十分專業(yè)。和滿是剪貼畫的幻燈片相比，簡單直接的設計能減輕你的工作量。

Most of the time, great design doesn’t mean being particularly artistic or knowing how to create amazing complex layouts. Instead, it’s about presenting information in an attractive and user-friendly way. With this goal in mind you realize that you’re probably trying way too hard if your end result is ugly. Try cutting out half or more of the elements on one of your slides and giving what’s left a strong left or right alignment with plenty of whitespace. 

大多數(shù)時候，一流的設計能以吸引人和用戶友好的方式呈現(xiàn)信息，而并不是意味著特別具有藝術(shù)感或是設計極為復雜的布局。記住這點，那么當成果槽糕時，你就會意識到自己可能做得過了頭了。試著將其中一張幻燈片一半或更多的內(nèi)容刪去，將剩下的內(nèi)容設置為左對齊或右對齊，并留下足夠的空白空間。

Conclusion

 

I hope this article has convinced you to abandon that clip art gallery once and for all. The benefits of clean, minimal design in presentations are clear: the information is easier to take in and the end result is more professional than the mess of information you typically see in presentation slides.

總結(jié)

我希望這篇文章能讓你從此拋棄剪貼畫?；脽羝蓛?，簡潔的設計所帶來的好處顯而易見：和通?；脽羝衼y糟糟的信息相比，其信息更容易為人所接受，效果更為專業(yè)。