胡歌的這張圖是怎麼做成的？

12-08

知乎專欄：我懂個P - 知乎專欄
PPT課程：我懂個P

曾經在微博上分享過一個超有誠意的《文字雲製作全攻略》，介紹了幾款很強大實用的文字雲工具，讓你五分鐘就能做出文字雲效果。

下面是教程原文，先來幾張琅琊榜的點點題。

好了教程開始，多圖預警：

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

以上。

感謝你能看到這裡。

還想跟我一起開腦洞？請戳：我懂個P

3.8更新
哈哈，今天女神節打開字雲更新完發現果然支持無水印素材了，國產良心啊~

2.20更新
發現字雲新版已經可以支持自定義輪廓了，如果能去水印就更好了

-----------------------------------------------------先上圖

--------------------------------------------------------------------------------------------------------------
看了這個問題下的全部的回答，我只能說，你們又是ppt又是瀏覽器又是ps之接切換難道不覺得煩嗎。。。。而且發現大部分的文字雲網站對中文支持都不是很友善（那幾個自己寫代碼的大神。。。請收下我的膝蓋orz）。換個思路，既然這個需求有這麼多人提，在app這麼豐富的時代，國內真的沒有團隊去做這個功能的移動端app嗎？
於是我去ios市場去搜了下關鍵字「文字雲」，果然，翻了幾頁我發現了這個：

看這有逼格的文案我就知道我找對東西了，於是馬上下了一個試試，視頻都沒來得及看。
打開app，ui很簡潔，功能也很明確，就是選擇一個輪廓，然後填充一條文字，然後就能生成一張高端大氣上檔次的卡片。有多種中英文字體可選，也有好多款不同的顏色色板和最終版式。

各位請忽略這個文案。。。這只是我當時體驗完各種文字雲網站然後找到這個app的心情。。。。
然後我發現了這個app不僅能填字，還能填圖！只需要在填字那個頁面點擊（去填圖）就可以選擇各種圖案。

厲害了我的哥，想要的基本效果都已經達到了，不過這個app有個致命的限制——不能上傳自定義圖片輪廓。只能用素材庫里那些輪廓。那麼題主的這個胡歌也沒法做了（那時我的心涼了半截，感覺不能好好裝逼了）
你以為這就結束了？
我當然不會死心，不然怎麼對得起上面兩張文案
找了半天，終於在這個app的「關於我們」里發現了這個

注意
裡面有一句關鍵的字——
更多專業功能，移步圖淘官網。
這尼瑪藏的太隱蔽了
感覺發現了新大陸，於是趕緊點進去看看有哪些專業功能。

進去嚇一跳，原來這個公司還有一款叫「圖癢」平面設計工具，裡面功能貌似更多，為了避免廣告嫌疑，我先把二維碼塗了，需要體驗的自己去搜就行，

然後我就下了圖癢，其他雜七雜八的功能我玩了大概半個多小時，差不多摸清了這個app的邏輯，這個app大致分四個模塊：
旋轉：用於logo製作
填充：填充文字圖片雲
修圖：把照片素材加上遮罩或者把素材二值化
拼圖：所有之前生成的素材可以在這裡自由組合

下面我重點講講我那張胡歌的圖的怎麼做的：
主要用到的是填充、修圖、拼圖三個模塊
原圖是這個

進入修圖模塊然後選擇這張圖再點擊剪影功能，你就會發現照片自動生成了下面這樣的效果，點擊保存獲得透明的_胡歌黑臉.png

然後進入填充模塊，選擇剛才獲得的黑臉作為輪廓圖，輸入文字，點擊渲染就行了。另外這裡還能調整文字的角度、方向、密度、顏色等參數，自由度比其他網站上不知道高哪裡去了。

然後進入拼圖模塊
然後將剛才的黑臉美化一下作為底圖，你可以直接改變底圖的顏色，不過我這裡做了一點更高級的做法，在修圖模塊中選擇一張漸變的背景

然後點擊遮罩功能，選擇胡歌黑臉那張圖，
你會得到一張這個圖

然後在上面添加剛剛生成的胡歌填充圖，
疊加一下，填充一下背景顏色，完工

這裡說明一下，由於我原圖選的尺寸比較小，所以看著有點鋸齒，如果選擇好一點的底圖作為素材的話，還有更好的效果
比如

總之，在這個軟體里，模塊化的操作思路很清晰，每個模塊都有各自的特點，相比於單純的文字雲網站，我覺得這個app更加接近「設計」這個概念，自由度也更加高。
最後附上我給自己學校做的一張圖，哈哈哈。（文中有一兩張作品是我從圖癢廣場上直接扒下來的，侵刪）

感謝 @OCDpatient的無私分享，get又一項裝逼的大殺器。
這裡我來補充一點點：在將照片導入網頁（Tagul - Word Cloud Art）之前，我們應該如何處理圖像。
這裡用處理人物肖像照片舉個栗子。

這是平時黑同學的一張照片。
如果我們直接把這張照片導入網頁的話，做出來的照片很難識別出圖片中人物。
如下圖，失去了辨識度。

主要原因是顏色過於複雜，即單色的照片相對來說是更好的選擇。
讓我們用PS對原始照片簡單處理。
第一步，導出照片，複製一層圖層好習慣。

第二步，用白色畫筆把不要的背景塗成白色。

第三部，圖像-調整-閾值。

第四部，把數值調整至你需要的大小。

第五部，根據自己要求再修飾一下，保存。
讓我們來看看這樣做的效果。

用這樣的方法處理了很多照片，最後都達到了滿意的效果~

————————————————————————————————
用這個創意做了一些最近要用到的圖片~供大家參考~

（不要說風格像FBI WARNING）謝謝觀看~歡迎交流~

這種文字人物圖片的效果可以用Photoshop實現，大致步驟是閾值&>色彩範圍&>蒙版&>定義畫筆預設文字填充。

主要是通過閾值調整得到黑白效果，然後色彩範圍-陰影選擇，之後對圖層添加蒙版，最後將自己想要寫的文字轉成畫筆預設進行填充就可以完成效果了。

如果對Photoshop不了解的可以參考Photoshop基礎教程實用技能精講，裡面詳細講解了Photoshop的圖層、蒙版、畫筆工具等等的內容。

下面我就借鑒實現文字人物圖片效果的例子講述大致的步驟，有需要的可以跟著例子模仿，對自己的技能掌握有一定的幫助。

1.首先打開所需要的人物圖片，進行備份（Ctrl+J）

2.圖像—調整—閾值，進行調整，得到黑白照

3.Ctrl+Shift+Alt+E蓋印圖層（這樣既把圖層合併了，還能保留原來的圖層，繼續編輯處理）

4. 在選擇窗口—色彩範圍—選擇陰影，調出人像選區，CTRL+J複製

5. 為了方便查看，新建一個圖層，填充白色，置於複製的圖層下面

6. 新建圖層，按住CTRL並點擊黑色人像圖層的小圖像調出選區，建立蒙版

7. 新建畫布，寫下需要的文字，調整字體，在編輯窗口-定義畫筆預設即可

8. 回到原畫布，調整畫筆，形狀動態大小抖動100%，為了方便觀察，可適當降低人像的透明度，開始畫字，需要注意的是，這裡的文字是一樣的，如果想要不一樣文字、字體，需要多花一點時間慢慢打。

9. 若想加其他內容，可調整畫布大小

除了上述的方法，還有一個類似的處理方法，通過色階調整人物的明暗度，創建圖層，添加文字，最後把複製的圖層隱藏，就可以得到需要的效果了。

下面我也借鑒一個例子向你們展示一下具體步驟：

最終效果圖：

原圖素材

1、打開要處理的素材（這裡以吳彥祖男神為例），然後Ctrl+L 打開色階調整人物的明暗度，參數如下

然後菜單—-濾鏡—–素描—-便條紙，參數如下。

（人物顏色是根據你設置的當前前景色而固定的，我用了藍色）

確定之後，Ctrl+Alt+2 把人物高光提出來部分，按Ctrl+Shift+i 反選一下，再按Ctrl+J 創建一層圖層出來

2、開始打字，這裡步驟有點多，打字內容可以根據自己需要來做，比如個人介紹什麼的不要打標點符號，不要全部都打在一個圖層，分兩個層來做：小字、大字。

【大字體】，打上自己想要的文字，調整字體大小，然後對文字更換字體（粗一些的字體），字體別太細，種類也不用很多，幾種就夠了。打好排版完成之後把那些大字體，合併成一個圖層命名大字

3、現在開始打【小字體】了。

主要是把文字圍繞在打字身邊，其它地方，用小字填充，盡量別複製，否則複製多的地方會出現平鋪一樣的紋理現象，如果遇到圖像面積比較大，那用複製也行，但是記得要改字體和大小。

字體輸入多了，可以建立一個組出來專門放小字（選要組合的文字圖層按Ctrl+G）這是一個體力活，慢慢弄吧，遇到面積大的圖像需要點時間。

然後把所有的小字都合併成一個圖層命名小字。按Ctrl點擊圖層1，然後反選一下，再用自由套索工具，按住Alt圈選人物邊緣的字，保留一點點有完整字體，這樣我們在刪除的時候會保留一些字體，不會因為輪廓太圓滑把字都切掉了。也可以適當羽化一下邊緣。

隱藏圖層1 ，可以看到處理好之後效果

所要的效果已經實現了，想要對文字進行美化的，可以進行文字漸變疊加，操作大概如下：

4、右鍵小字圖層—–混合選項—-選擇漸變疊加

色標顏色如下

#f0803c #EE4935
#D13A49 #A23D4D #80556B #2068a0
#0f6892

色標位置如圖：

設置好了之後點擊面板上的【新建】這樣就可以保存這個漸變，下次就不用再重新設置色標了。

5、右鍵大字圖層 —–混合選項—-選擇漸變疊加，選擇我們剛剛第一次新建的那個漸變。

然後在圖層2白色圖層上面新建一個空白圖層，按Ctrl點擊圖層1 載入選區，然後給這個新圖層拉一個漸變，漸變色用，我們剛剛給人物用的那個顏色。完成之後再—-濾鏡—-模糊—高斯模糊，參數如下圖。

模糊好了之後把圖層不透明度改為8%，這樣作品就做好了，漸變顏色可以根據個人喜歡去調整。

作品完成圖層結構：

最終效果圖：

如果想學習更多PS實現的案例，可以參考PS全行業案例實戰，教程跨越平面設計、室內外設計、攝影后期等等領域。

我就介紹到這裡，有新的內容會更新~

那時，我不知道最高票答案的那個方法，於是，我特么的是一步步慢慢做的，做了一兩個小時～
看到好多答案都是看了第一的答案來交作業的。那我就粗略的寫一下我自己的教程吧。當初也不知道在哪裡看的教程了，想找找不到了，所以憑印象大概寫一下吧。（邊寫我也試著操作的，所以打字之前和打字之後的步驟應該都是對的，打字我就不操作了，太繁瑣了，我那時是多無聊⊙﹏⊙‖∣）
一、打開要做效果的圖片，最好是白色背景人物照哈。
二、打開色階，移動下面三個小三角調整圖片的明暗度，讓明暗突出，對比明顯。
三、濾鏡——素描——便簽紙。顏色是看你的前景色的，不要黑色，待會要打黑色字。
四、通道，按住ctrl單擊RGB那裡圖片部分選出高光，菜單選擇——反選，選出人物輪廓。ctrl+J複製選區。
五、開始無休止的打字，先打大字，這些大字打完以後合成一個圖層。然後是繁瑣的小字，圍繞填充在大字旁邊，別所有的小字都一樣，不然出來的作品紋理方便就會差一點了。
六、打完字以後，要刪除多餘的字，按住ctrl單擊人物選區圖層，切換到字體圖層（完成第五步後把所有字合併成一個圖層），反選，按del鍵就OK。
接下來就是選擇自己喜歡的漸變顏色什麼的，讓效果圖看起來好看就行了。
上圖

關鍵詞：Python

標籤雲其實是個很老的東西了，最初看到的時候不明覺厲，後面了解以後發現了現成的生成網站，也就沒那麼吸引人了。
關注這個問題很久，上面的諸位大神都說的很好了。最近剛好嘗試了一系列更加 GEEK 的做法，在網上也沒有搜到太多中文博客先例，所以還是決定共享給大家。

一句話…你說的我都懂，可是這種圖到底是怎麼做出來的呢？網站，網站，還是網站！網站他會用，她會用，我也會用，又怎麼能顯示出我的不同與逼格呢！

以下內容，編程小白可能會不明覺厲。但只要你是個 Python 編程入門的人，就完全可以自己用代碼實現生成詞雲，並微調出自己喜歡的效果！那麼從小白到入門需要多久呢…我個人認為只需要幾天甚至更短的時間！所以各位看了以後如果心動，不妨將這一點技能順手點上。

先展示結果好了，這只是初步嘗試時做出的一些粗糙結果，大家可以嘗試更加定製化地微調出更好的效果。為方便演示我選用了英文，支持中文的方法會在後面介紹。

用到的工具：
Python 2.7
word_cloud （可以直接使用 pip install wordcloud 安裝，自行補充相關依賴）

amueller/word_cloud · GitHub
這是官方項目地址，我們可以在裡面找到文檔說明和樣例。當然，看不懂也沒有關係。移步我的專欄，有部分文檔翻譯和詳細的樣例說明。
Python pytagcloud 中文分詞生成標籤雲系列（一） - 小段同學的雜記 - 知乎專欄
Python word_cloud 部分文檔翻譯標籤雲系列（二） - 小段同學的雜記 - 知乎專欄
Python word_cloud 樣例標籤雲系列（三） - 小段同學的雜記 - 知乎專欄

專欄寫的很詳細了，我就不重複複製粘貼了。簡單貼一下上面第二幅圖的代碼，你只需要自己修改其中很少的部分，就可以實現相同的處理了。

#!/usr/bin/env python2 """ Image-colored wordcloud ======================== You can color a word-cloud by using an image-based coloring strategy implemented in ImageColorGenerator. It uses the average color of the region occupied by the word in a source image. You can combine this with masking - pure-white will be interpreted as "don"t occupy" by the WordCloud object when passed as mask. If you want white as a legal color, you can just pass a different image to "mask", but make sure the image shapes line up. """


from os import path

from PIL import Image

import numpy as np

import matplotlib.pyplot as plt
from wordcloud import WordCloud, STOPWORDS, ImageColorGenerator
d = path.dirname(__file__)
# Read the whole text.

text = open(path.join(d, "alice.txt")).read()
# read the mask / color image

# taken from http://jirkavinse.deviantart.com/art/quot-Real-Life-quot-Alice-282261010

alice_coloring = np.array(Image.open(path.join(d, "xhr.jpg")))
wc = WordCloud(background_color="white", max_words=2000, mask=alice_coloring,

               stopwords=STOPWORDS.add("said"),

               max_font_size=40, random_state=42)

# generate word cloud

wc.generate(text)
# create coloring from image

image_colors = ImageColorGenerator(alice_coloring)

# show plt.imshow(wc) plt.axis("off") plt.figure() # recolor wordcloud and show # we could also give color_func=image_colors directly in the constructor plt.imshow(wc.recolor(color_func=image_colors)) plt.axis("off") plt.figure() plt.imshow(alice_coloring, cmap=plt.cm.gray) plt.axis("off") plt.show()

答案就寫這麼多吧。如果感興趣，自然會自己深入學習，這些東西本不難。我也只是嘗試入門，拋磚引玉。

最後簡單談談對此類處理方法的看法：

分詞、取詞是關鍵和基礎。圖片畢竟只是一個可視化的展示手段，內容更重要。要合理選擇內容，提取關鍵詞。像原圖中出現了一些無關緊要的詞語，比如金正日平壤會見胡錦濤主席特使這樣讓人不明所以的語句。大家做的時候還是要用心一點，萬一有人細心看裡面的內容呢。

遮罩圖片的選擇很重要。首先需要是大面積白底，否則會整張圖片鋪滿詞語。其次，圖片的顏色要豐富，最好能有漸變度，這樣的配色會很舒服。但是符合條件的圖片實在是太難找了…可遇而不可求。

最後，完美的圖片需要很多次地微調參數。詞語的數量，字體的大小等，都會對整張圖片的效果和詞雲形狀的擬合度產生影響。

當然，我們也可以在輸出圖片後配合其他後期軟體進行處理，使其更加高大上。

希望對大家有幫助，如果能引起你們學習 Python 的興趣，那就更棒了。

以上。

Windows 下中文支持的方法。

1、準備好一個中文字體，如 simhei.ttf

2、將其複製到 C:Python27Libsite-packageswordcloud

3、在 wordcloud.py 中修改 FONT_PATH 為相應字體。（注意是大寫，大寫的字體路徑是默認路徑，小寫的字體是後面使用時可以再次指定的，會覆蓋默認字體）

FONT_PATH = os.environ.get("FONT_PATH", os.path.join(os.path.dirname(__file__), "simhei.ttf"))

4、注意中文的編碼應為 utf-8 ，否則會導致亂碼無法顯示

#可以參見不知道什麼語言的用戶提出的 issue Word cloud unicode (multilanguage) problem · Issue #70 · amueller/word_cloud · GitHub

我是看了最高票答主的答案照著做的，用的是我自己的照片，來彙報成果啦~

----------------小心翼翼的分割線-----------------------------------------------------------------------

昨天用的是自己的照片，然後評論區一臉嫌棄的樣子〒_〒，於是今天決定用大帥比的照片來試試~成果如下：

然後有點經驗分享，就是選擇圖片時先用PS把圖片的對比度和亮度調高一點，這樣做出來的輪廓會更清晰，比如下面這張對比度就不高，出來的效果是這樣：

前者貌似更符合高票答主最後的效果。最後再放一張用我男神照片做的圖片，不知道你們看不看得出他是誰……

有人問中文字體的事，我就在這裡統一回復一下吧。
網站自帶的字體只有英文，所以要打中文的話得從自己電腦載入字體，它選字體那個界面有個添加字體的按鈕，你就從那裡去電腦里導入字體就行了，如果電腦沒有中文字體或者你找不到的話可以先在網上下載下來再去找。
是有兼容性的問題，我也遇到過，不過我是一個一個試的，大多數都是能兼容的，我對字體方面的知識不了解，所以具體原因不了解。
這是我用的字體，想用的自己找找吧， http://pan.baidu.com/s/1ntpJIHV

忽想起94年的這幅圖

謝謝 @OCDpatient，以下是我的小作品，哈哈，最喜歡小黃人了

九月十九這兩顆眼珠太贊

根據ocd的方法做的，效果很好，就是下載不了好鬱悶

來交作業了

我自己畫個，哈哈

mathematica代碼：

pic = 你的圖片; WordCloud[{ToString[Style[#, RandomColor[]], StandardForm] /@ Table["胡歌", {500}], RandomReal[1, 500]} // Transpose, Binarize[ColorNegate[pic], 0.526], ImageSize -&> Large, WordSpacings -&> 0, WordOrientation -&> "Random"]

這個代碼比較簡陋，高手可以做的更好，:-D。

有一種叫文字雲生成器的東西。一秒鐘搞定

也不難

然而年輕時候的我只會手動把字一個個碼上去，大概六七年前做的，顧城的詩句組成頭像。

Python的wordcloud庫+jieba分詞完美支持中文。
安利推廣
Wordcloud中英文詞雲生成器WCM_V2.0升級版
Python編寫的支持中文詞雲(wordcloud)GUI界面程序

原料：胡歌黑白照片一張

琅琊榜小說一本：琅琊榜完整版.txt
加上上面軟體

走你

我真是太傻了！他一點都不喜歡我！那我以後找別人當老公好了！哼！後悔去吧！…………………………………………………

用真人照片跟著排名第一的教程做了一下，還不錯(⊙o⊙)，帥帥噠～我未來滴老公～

認真學習了高票答案的講解（萬分感謝高票答主哈），雖然我的水平還是很渣，但真的真的很用心來給我家程序員男票做的圖……

作為一個文藝情懷泛濫的學生黨，除了能偶爾給我家男票寫個詩、畫幅畫以外我不知道還可以做些什麼。看他每天那麼辛苦從早到晚敲代碼，我其實很想給他買機械鍵盤之類能讓他工作可以舒服點的東西。但是我又深知，這些東西我還是以後用自己掙的錢買給他會更有意義。

honey，昨天你跟我說我已經給了你足夠的驚喜和幸福，但是你自己卻做的不夠好。聽你這麼說，我淚都快下來了，真的。這輩子能遇到和我契合度這麼高的你，就是老天賜予我最大的驚喜。作為彼此的小蛔蟲，我們都不要擔心，不要擔心未來，雖然我們深知有多麼不易。不要擔心誰做的多誰做的少，那些一點也不重要，你要是沒給我那麼多溫暖那麼多感動我又怎麼會如此沉淪。我就這一顆心，怎麼可能不全給了你。