起點課堂會員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會特權(quán)
個人IP打造特權(quán)
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導(dǎo)直播
12場專業(yè)技能直播
會員專屬社群
榮耀標識從“太陽”到“時光企鵝”：一個QQ設(shè)計師眼里的界面變遷史
從1999年OICQ的誕生到如今的“時光企鵝”，QQ不僅是一個社交工具，更是幾代人的青春記憶。本文將帶你穿越時光，回顧QQ從最初的極簡界面到如今的極簡卡片設(shè)計的演變歷程。
前幾天看到騰訊發(fā)了個消息，挺有意思：全球第一個QQ等級達到滿級256級的人出現(xiàn)了！恭喜全球首位256級QQ用戶獲得“金企鵝” 這位“大神”足足掛了22年才達成這個成就。更特別的是，達到這個等級會解鎖一個全新的圖標，叫“時光企鵝”。
現(xiàn)在大家可能不太在意這個了，但回想零幾年那會兒，大家都很沉迷”掛QQ”，等級就是“排面”。轉(zhuǎn)眼這么多年過去，想想還挺懷念的。
我上高中才接觸QQ，當(dāng)時掛QQ追求的是要沖到太陽。記得那時候等級是按在線時長算的，為了加速升級，我們經(jīng)常拜托去網(wǎng)吧通宵的同學(xué)幫忙掛著。一臺電腦掛好幾個QQ，簡直是常規(guī)操作。后來有了手機QQ，手機QQ基本上可以一直在線，加上注意力轉(zhuǎn)移，慢慢地就不太在意等級了。
在那個網(wǎng)絡(luò)剛剛普及的年代，大家都特別熱衷于在虛擬世界里打造自己的身份標識。QQ等級、QQ空間裝扮、QQ秀… 現(xiàn)在回頭看，可能有點難理解，為什么會對這些虛擬的東西那么著迷？
后來微信流行起來，我登錄QQ的次數(shù)逐漸就少了，唯一的用處就是登錄QQ用來截圖。沒想到的是，畢業(yè)多年后，我竟然加入了QQ團隊，當(dāng)上了QQ的設(shè)計師！
我在QQ做的第一個設(shè)計是QQ運動，后來又開始做厘米秀，從2D做到3D。不過，不知道是自己年紀大了，還是玩膩了這類東西，我發(fā)現(xiàn)自己慢慢不再是這些功能的目標用戶了。
時代的車輪不停向前轉(zhuǎn)，每個產(chǎn)品都會經(jīng)歷成長、成熟和逐漸淡出。但作為一名設(shè)計師，回過頭去研究這些曾經(jīng)的“頂流”APP，看看設(shè)計潮流是怎么一路變化的，依然很有價值。這不僅是學(xué)習(xí)，也是一種紀念。
這份懷念一涌上來就停不住，干脆就徹底整理一下吧！我把QQ從誕生到現(xiàn)在，關(guān)鍵界面的設(shè)計變化都梳理了一遍，也算是在找回自己那些“逝去的青春”。
好，我們穿越時光，從1999年開始。
1999年：OICQ誕生
時間回到1999年，那一年是OICQ誕生的日子。當(dāng)時的界面極簡，基本沒啥UI設(shè)計，都是系統(tǒng)默認的窗體?！癘ICQ”這個名字的含義是”O(jiān)h, I Seek You“，借鑒ICQ，后因版權(quán)爭議更名。
圖片來源于網(wǎng)絡(luò)
2000年：改名“騰訊QQ”
2000年，正式更名“騰訊QQ”，界面布局有微調(diào)但風(fēng)格上基本沒有啥太大變化。
圖片來源于網(wǎng)絡(luò)
2001-2002年：交互小創(chuàng)新
2001-2002年，風(fēng)格沒變化，但在交互上做了創(chuàng)新。增加“隱身”登錄狀態(tài)選項。把登錄流程要填的內(nèi)容做了分拆，登錄的首界面更簡潔易懂。
圖片來源于網(wǎng)絡(luò)
2003年：第一次大改版
2003年，首次全面改版了界面，圖標設(shè)計和按鈕設(shè)計有了一些質(zhì)感。這個版本奠定了后續(xù)十年QQ的界面框架基礎(chǔ)。
圖片來源于網(wǎng)絡(luò)
2004年：設(shè)計感初顯
2004年，慢慢多了一些設(shè)計感了，估計是從這個版本開始，UI設(shè)計師開始深度介入，色彩更鮮明，布局也更緊湊，擬物時代的設(shè)計特點都有了。
圖片來源于網(wǎng)絡(luò)
2005年：優(yōu)化與精簡
2005年，界面進一步被優(yōu)化，去掉了一些文字說明，把一些信息做了更好的分組。整體的風(fēng)格保持了延續(xù)。
這一年，我注冊了自己的第一個QQ號。
圖片來源于網(wǎng)絡(luò)
2006-2007年：個性化開端
2006年，界面支持更換主題，設(shè)計上做到了更加個性化。經(jīng)典界面逐步定型了下來。界面更加干凈，信息分組越來越清晰。
圖片來源于網(wǎng)絡(luò)
2008年：經(jīng)典“國民QQ”
2008版，因穩(wěn)定性和功能全面性，成為用戶記憶中最經(jīng)典的“國民QQ”。界面設(shè)計上的變化相對較少。
也似乎是從這一年開始，后面的日子過得越來越快了，經(jīng)常會有種錯覺，分不清2008和2018，不知道你有沒有這種感覺？
圖片來源于網(wǎng)絡(luò)
2009年：大幅精簡
2009年，界面內(nèi)容做了非常大的精簡。
圖片來源于網(wǎng)絡(luò)
2010年：高度自定義
2010年，界面可以自定義的內(nèi)容更多了，支持全界面自定義皮膚（透明度、顏色、圖片）。
圖片來源于網(wǎng)絡(luò)
2011-2012年：平穩(wěn)過渡
2011年，界面變化相對較小，處于一個穩(wěn)定的狀態(tài)。
圖片來源于網(wǎng)絡(luò)
2012年。
圖片來源于網(wǎng)絡(luò)
2013年：情感化與自然風(fēng)
2013年，QQ的UI設(shè)計理念更加貼近自然，如登錄界面飄揚的云朵、天氣面板中的動態(tài)效果等。同時，QQ開始強調(diào)情感屬性，如弱化按鈕設(shè)計，提升用戶辨識度。
這一年也是我從大學(xué)畢業(yè)的日子，大家所有的情愫和溝通，全部都是寄托在了QQ里。
圖片來源于網(wǎng)絡(luò)
2014年：擁抱扁平化
2014，QQ進行了重大UI設(shè)計變革，引入了扁平化設(shè)計理念，界面變得更加簡潔、清爽。同時，QQ更注重用戶體驗，如聊天窗口的優(yōu)化、消息提醒的改進等。
圖片來源于網(wǎng)絡(luò)
2015-2017年：延續(xù)與微調(diào)
2015-2017年，這幾年的風(fēng)格也沒太大變化。
圖片來源于網(wǎng)絡(luò)
2018-2022年：極光理念與移動優(yōu)先
2018-2022，采用了極光的設(shè)計理念。經(jīng)典品牌文化的延續(xù)性，從企鵝的家極地周圍的環(huán)境衍生出極光的概念。移動優(yōu)先與極簡主義，適配移動端操作習(xí)慣，平衡功能豐富性與界面簡潔性。
這一年，我加入了QQ，開始了極光之旅，時間也如極光一般，美麗卻又短暫的一晃而過。
圖片來源于網(wǎng)絡(luò)
2022年之后，我就基本上很少再用QQ了，大家對最新的界面也都很了解了，就不再贅述去寫了。
這些年，界面一直在變，QQ的形象也有一些變化。最初的版本，QQ團隊選擇的是一個胖乎乎的版本（2000年的時候），因為它更加可愛。當(dāng)時的設(shè)計師樁子認為，企鵝形象不一定要對稱，有一定的差異反而更有靈動感，因此他將企鵝的眼睛設(shè)計成了wink狀，翅膀一高一低。
企鵝形象終稿手繪圖，圖片來源騰訊QQ
到現(xiàn)在慢慢的為了適應(yīng)QQ品牌心智的需要，QQ的比例變得更加年輕，外形也更加簡潔。
圖片來源于網(wǎng)絡(luò)
圖片來源于網(wǎng)絡(luò)
最近這些年，QQ的重心在移動端，PC客戶端的界面大的改動變少了，更多是細節(jié)上的優(yōu)化。不過，這些年的設(shè)計趨勢不也是沒啥太多變化嗎？似乎也是一種印證?；谟脩舻男枨?，大的方向是減少視覺噪聲，讓用戶的體驗更加聚焦。
總結(jié)這些年QQ的設(shè)計變化趨勢：
1）形態(tài)演變。 純文字列表 → 立體化圖標 → 扁平動態(tài)設(shè)計 → 極簡卡片 （1999純文本 → 2003立體化 → 2013扁平化 → 2023 NT架構(gòu)）
2）設(shè)計哲學(xué)。 實用性 → 個性化 → 情感化 → 效率化 （早期能用就行→中期強調(diào)自我表達→近期追求無縫體驗）
本文由人人都是產(chǎn)品經(jīng)理作者【彩云sky】，微信公眾號：【彩云譯設(shè)計】，原創(chuàng)/授權(quán) 發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。
題圖來自Unsplash，基于 CC0 協(xié)議。
懷念那個年代的QQ，掛機沖等級的日子真讓人難忘，現(xiàn)在雖沒那么執(zhí)著，但看到這256級的設(shè)計，還是能感受到情懷和傳承。