給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

編者按:去年那封公開信火得一塌糊涂,甚至驚動(dòng)到老羅,木想到今天作者又出新篇了,槽點(diǎn)依舊犀利,不過只有強(qiáng)迫癥設(shè)計(jì)師才找得到 >>>

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

[核心提示] :文案啰嗦、前端奇葩、流程混亂和人才缺失,這位挑剔的設(shè)計(jì)師又有了新的槽點(diǎn)。

作者公眾號(hào):OCDesigner,歡迎關(guān)注呦

老羅:

你好,又見面了。之前我介紹我說是一個(gè)有強(qiáng)迫癥的設(shè)計(jì)師,后來發(fā)現(xiàn)有些強(qiáng)迫癥的人洗手能洗一個(gè)小時(shí),跟他們相比,我還是說我其實(shí)是一個(gè)眼里容不得沙子的產(chǎn)品經(jīng)理更合適吧。

去年 9 月給你寫一封公開信,里面有關(guān)于錘子官網(wǎng)有不下 10 條的吐槽。然而經(jīng)過和你們的良好互動(dòng),里面 95% 的問題都得以修改和規(guī)避了。所以才有了新的這封公開信。

那封公開信:《給老羅的公開信!一個(gè)設(shè)計(jì)師關(guān)于錘子官網(wǎng)的吐槽》

一、免責(zé)聲明

作為外部人士,有的「猜測(cè)」未必準(zhǔn)確。但我相信其中一些是程度問題,而不是有沒有的問題。因輕信和參考里面的信息而帶來了任何直接或間接損失與本人無任何關(guān)系。如對(duì)此聲明有異議,則請(qǐng)停止閱讀來信。

二、使用環(huán)境

  1. 電腦硬件:MacBook Pro (Retina, 15-inch, Late 2013)
  2. 系統(tǒng)版本:OS X 10.10.4 (14E17e) [系統(tǒng)語言為中文]
  3. 瀏覽器:Safari 8.0.7 (10600.7.5)
  4. 所有截圖均來自 5 月 9 日到 10 日期間

三、問題概括

  • 文案啰嗦
  • 前端奇葩
  • 流程混亂
  • 人才缺失

四、具體說明

(一)文案啰嗦

1)功能介紹文字的「論據(jù)」毫無說服力,邏輯混亂。

網(wǎng)站的每一屏就應(yīng)該是一個(gè)能夠說服人的「幻燈片」,每個(gè)小標(biāo)題是一個(gè)論點(diǎn)的話,那下面論述它的文字就應(yīng)該是論據(jù),而錘子官網(wǎng)的文字卻可謂是亂寫一通。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

圖中小標(biāo)題(論點(diǎn))看起來是要論述「OS 美觀、易用和人性化」。正文(論據(jù))句子主干卻是:「提高至程度」、「打磨至程度」和「貫徹至程度」,超長定語組合而成的三個(gè)排比句,沒有明確主語,讀得人云里霧里,也跟「美觀」、「易用」和「人性化」沒什么對(duì)應(yīng)關(guān)系。

第二段的句子主干是「新特性讓你無回頭之路。」多少給人一種很恐怖的感覺。另外,「七年一遇」的哏默認(rèn)誰都知道嗎?埋了包袱卻不抖,給人一種另一只鞋沒落地的感覺。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 蘋果中文官網(wǎng)

而上圖是來自蘋果官網(wǎng)的例子。小標(biāo)題(論點(diǎn))「iOS 版本」。正文(論據(jù))句子主干:「iOS 8 系統(tǒng)功能和特性將優(yōu)勢(shì)呈現(xiàn)」,主語明確,完成的任務(wù)明確。

第二句的主干是「這不僅是絕佳匹配,更是絕佳體驗(yàn)。」易懂且準(zhǔn)確。

2)啰嗦的文案「貫徹」了網(wǎng)站和產(chǎn)品。

文案應(yīng)該追求的是簡短、精準(zhǔn)。不能長篇累牘和「講故事」。這樣的文案或許在剛開始的時(shí)候帶來趣味和傳播(營銷),但當(dāng)用戶重復(fù)打開使用時(shí),就會(huì)像一直講的冷笑話一樣無聊。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 湖南衛(wèi)視《真正男子漢》

累贅的文案就像是多余的配音,開始有它是為了「搞笑」,之后有它卻「可笑」。上面的視頻中,王寶強(qiáng)在訓(xùn)練扣動(dòng)扳機(jī)時(shí)還自配音效,要說相較于沒有音效的訓(xùn)練,教官可能更能了解的他的發(fā)射動(dòng)作。而當(dāng)他被訓(xùn)斥需要配音來十遍的時(shí)候,配音就顯得多余且可笑了。

有時(shí)候?yàn)榱嗣庳?zé)或者說明,看起來錘子不得不說上好長一段介紹性的文字。這些文字保留了我們?cè)O(shè)計(jì)功能的初衷,它也切實(shí)對(duì)功能的使用提供了趣味和說明。

然而如果這是一個(gè)使用情景稍高的功能的話,廢話連篇的說明總讓人厭煩,畢竟現(xiàn)在沒人愿意閱讀,尤其是反復(fù)閱讀。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技英文官網(wǎng)

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子便簽英文界面

「What`s the point?」外國人無法 Get 到的「點(diǎn)」,正成為國際化的障礙。

產(chǎn)品和網(wǎng)站文案的撰寫應(yīng)該「去流行化」和「去區(qū)域化」。將當(dāng)下網(wǎng)絡(luò)上流行的文字和句式寫入文案將成為一場(chǎng)災(zāi)難。除了長達(dá)一年非更新期里它早晚會(huì)不流行,更多是因?yàn)槲幕町愋纬傻摹高纭雇ǔ2荒鼙缓芎玫姆g并傳遞給外國人。

上圖 1 的 Revolutionary、Disruptive、Redefined 的哏最早來自于蘋果的廣告,但糟糕的是蘋果廣告的英文版中卻從未出現(xiàn)過這幾個(gè)詞,這就造成了「點(diǎn)」的丟失。上圖 2 所指的部分用戶其實(shí)來自中國,冷嘲熱諷用戶還煞有介事的被翻譯出來,肯定也有所不妥。

(二)前端奇葩

1)網(wǎng)站中多處文本顯示都是靠圖片完成。

這既不利于傳播(SEO 和復(fù)制),修改和維護(hù)的成本也被提高。當(dāng)需要更新和修改文本的時(shí)候,就必須有設(shè)計(jì)介入并出多份素材最終才能更新,加長了工作鏈條。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

上圖中這些排版或簡單或復(fù)雜的「文字與圖片」全部靠加載一整張圖片來實(shí)現(xiàn)的。

沒有任何理由使用圖片展示網(wǎng)頁最基本的元素,將文字在內(nèi)的元素全部以圖片的方式來呈現(xiàn),既影響網(wǎng)頁的加載速度,浪費(fèi)服務(wù)器的資源,同時(shí)也不尊重系統(tǒng)本身的文字渲染方式,顯示效果也不是最佳的。

上面陳列的文字在排版樣式上幾乎可以說是沒有任何奇特之處,通過簡單代碼實(shí)現(xiàn),既利于維護(hù)更新,也會(huì)加快移動(dòng)版的開發(fā)進(jìn)度(元素復(fù)用)。

2)前端的惰性還反映在僅對(duì)最終效果負(fù)責(zé),而不對(duì)實(shí)現(xiàn)方式負(fù)責(zé)。

樣式的多樣性和材質(zhì)素材的使用并不應(yīng)該成為偷懶的借口。我所看見的樣式均可以通過代碼「干干凈凈」的完成。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

上圖中為了實(shí)現(xiàn)頁面材質(zhì)底紋,前端使用了一張 2350×7146 的背景圖片。

分個(gè)層、切個(gè)片、或者什么都不做,直接一整張圖放上去。用「設(shè)計(jì)圖本人」來還原「設(shè)計(jì)圖」,那么還原效果當(dāng)然是「一級(jí)棒」啦。然而這樣越是看上去的「高大上」的頁面背后,實(shí)現(xiàn)的方式卻越是 low 到了極點(diǎn)。

其實(shí)并不是因?yàn)殄N子因?yàn)閳?jiān)持「擬物風(fēng)格」才會(huì)遇此難題,游戲網(wǎng)站也常常使用「卷軸」樣式來發(fā)布公告等,卻也未曾見過如此沒有技術(shù)含量的實(shí)現(xiàn)方式。

(三)流程混亂

1)代碼的維護(hù)和管理暴露了流程管理的混亂。

比如對(duì) Retina 屏的支持,一樣的內(nèi)容形式,一張就支持,一張就不支持,可見缺乏規(guī)范。

同時(shí)該公用代碼的地方,沒有建立起公用代碼,多份不同代碼同時(shí)運(yùn)作才會(huì)導(dǎo)致 bug 改了又改。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

高清屏兼容還是不兼容并不是事,是事的是沒有明確的需求,就不會(huì)有明確的行動(dòng)。

錘子當(dāng)然可以在意或者不在意高清屏的份額,也可以在意或不在意高清屏的體驗(yàn)。但無論怎樣,這都是一開始就需要被定下來的需求,這樣才有標(biāo)準(zhǔn)來執(zhí)行和規(guī)范。

同一個(gè)頁面中,同等類型的素材,有的就是 Retina 素材,有的就不是,沒有任何理由。缺乏規(guī)范的管理,必然流程混亂。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

同一個(gè)世界,同一個(gè)夢(mèng)想。相同的樣式采用公用的代碼,維護(hù)更新才可以高效便利。

錘子科技的官方在底部樣式徹底一樣的情況下,卻使用了分開維護(hù)的多份代碼。這樣的做法常常會(huì)導(dǎo)致 bug 死灰復(fù)燃,就如圖中那樣,曾更新修改了備案信息為文本,網(wǎng)站上卻仍舊因?yàn)闆]有調(diào)用公用代碼來再出現(xiàn)老的樣式。

公用代碼的建立與維護(hù)的意識(shí)缺乏,暴露了產(chǎn)品經(jīng)理的流程管理不足。

2)項(xiàng)目的推進(jìn)時(shí),「相關(guān)」或「受影響」項(xiàng)目沒有更新。

相關(guān)部門不了解自己手中的可用資源有哪些,更不了解手中項(xiàng)目牽扯的項(xiàng)目有哪些。或者知道也不記得更新。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技公眾賬號(hào)

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

圖 1 的錘子科技公眾賬號(hào)于 5 月 4 日發(fā)布了招賢納士的通告,招聘了文案編輯等新近人才。圖 2 官方網(wǎng)站的最后更新時(shí)間是 3 月 20 日,找不到公號(hào)羅列的職位。

「這個(gè)有效果先發(fā)這個(gè),回頭再更新那個(gè)。」項(xiàng)目推進(jìn)應(yīng)有流程管理,這是工作積累的最大財(cái)富。

蘋果要開發(fā)布會(huì)要上新品了,首先都會(huì)把在線商店先下線了。這樣的流程即是他們的最佳實(shí)踐,也給用戶形成固定期待。

懂得了解自己的資源和業(yè)務(wù),才能安排和規(guī)劃出合理的流程。推進(jìn)項(xiàng)目時(shí)先分析出哪些項(xiàng)目受影響,并通過分發(fā)或自己完成的方式來避免受影響項(xiàng)目的滯后和出錯(cuò),最終將合理流程總結(jié)固化,就能成為公司重要的財(cái)富。

(四)人才缺失*

*人才的缺失:并不意味著需要大量的招聘或者解聘,它默認(rèn)應(yīng)該是團(tuán)隊(duì)現(xiàn)有人員的專門素質(zhì)有意識(shí)的培養(yǎng)。

1)技術(shù)人才的缺失。

① 勤勞的技術(shù)人才

② 先鋒的技術(shù)人才

③ 懂得查漏補(bǔ)缺的技術(shù)人才

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

勤勞并不僅僅是快速工作。從未放低過自我要求的人,才能有所創(chuàng)造。

不會(huì)有時(shí)間充足的開發(fā)項(xiàng)目,「時(shí)間不夠」不應(yīng)成為任何事的借口。堅(jiān)守自己:時(shí)間和 sense 就是你的陣地。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

審美或許可以循環(huán),而技術(shù)只會(huì)向前發(fā)展。做到今天的錘子已不容易

但何不將它做得更好。

只有錘子科技的員工都能夠自我驅(qū)動(dòng)和快速學(xué)習(xí)了,錘子科技才會(huì)有光明的未來。技術(shù)當(dāng)然應(yīng)該成為科技公司改變世界的法寶,學(xué)習(xí)和運(yùn)用它才應(yīng)該錘子驕傲的資本。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

讓員工懂得查漏補(bǔ)缺,就要讓員工感覺公司是自己的。經(jīng)過開發(fā)完善的每一行代碼,都只為讓產(chǎn)品更美。

斯巴達(dá)方陣的勇猛建立在戰(zhàn)士對(duì)每個(gè)看守他后背的另外三個(gè)戰(zhàn)士的信任。有全局觀,能發(fā)現(xiàn)同事的不足并主動(dòng)完善。

2)產(chǎn)品經(jīng)理的缺失

沒有產(chǎn)品經(jīng)理來把任務(wù)的真實(shí)需求了解,來把「使用情景」分析,甚至導(dǎo)致了 key feature 的丟失。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

via 錘子科技官網(wǎng)

讓無數(shù)「錘粉」、「羅粉」揚(yáng)眉吐氣的 IF 獲獎(jiǎng)頁面: 不能復(fù)制任何一個(gè)字,沒有任何一個(gè)分享按鈕。

因?yàn)榭壳衅N圖的方式來實(shí)現(xiàn),IF 獲獎(jiǎng)的榮譽(yù)頁面既然沒有任何一個(gè)字可以供用戶或者科技媒體復(fù)制。同時(shí)這個(gè)頁面從頭到尾從上到下沒有一個(gè)「分享」按鈕。難道錘子希望的,用戶需要的不就是一個(gè)「傳播」的功能嗎?既然就這樣 miss 掉了。

在錘子「好看」往往成為需求,而它其實(shí)只是要求。對(duì)需求的理解是產(chǎn)品經(jīng)理的職責(zé)。

3)戰(zhàn)略人才的缺失

在錯(cuò)過的和還未來到的戰(zhàn)略意義的時(shí)刻,錘子一直沒有一個(gè)具有戰(zhàn)略觀的人才出現(xiàn)。

小米公司:

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

小米手機(jī):

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

小米網(wǎng)站:

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

今天看來,小米的每個(gè)項(xiàng)目與品牌都完成了各自的使命與定位。然而故事剛開始時(shí),小米只是比較早懂得管理粉絲的關(guān)注力而已。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

小米手機(jī):

  • 永遠(yuǎn)的「產(chǎn)能不足」
  • 不斷豐富的產(chǎn)品線
  • 毫無規(guī)律的進(jìn)化路線

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

小米網(wǎng)站:

  • 發(fā) F 碼、搶購(定期吸引流量)
  • 招人(擴(kuò)大團(tuán)隊(duì))
  • 手機(jī)配件(手機(jī)殼、貼膜)
  • 小米周邊(兔子、書包、T 恤)
  • 貼牌的各種商品(鼠標(biāo)墊、電視)
  • 電子書雜志(多看)
  • 收購整合的新產(chǎn)品(智能硬件)

反觀錘子官方網(wǎng)站,在線商城功能沒有加分反而扣分。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

錘子手機(jī):

  • 前期產(chǎn)能不足
  • 單一產(chǎn)品線

錘子網(wǎng)站:

  • 招人(公告、員工訪談)
  • 電子商城(手機(jī)配件、第三方周邊)

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

錘子官網(wǎng)在線商城:

  • 銷售商品屈指可數(shù)
  • 全站唯一整塊不支持 Retina 屏的板塊
  • 大部分商品實(shí)際上不可購買
  • 前端實(shí)現(xiàn)奇葩,體驗(yàn)差勁
  • 入口較深,不認(rèn)可為主要業(yè)務(wù)

所謂小米模式:

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

所謂錘子模式:

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

一樣的機(jī)遇與挑戰(zhàn),缺乏戰(zhàn)略眼光和人才的錘子,讓人感覺「沒愛夠」。

小米與錘子的「營銷天分」并沒有相差太多,遇到相同的問題,小米卻能通過持續(xù)制造尖叫的方式,不斷吸引甚至玩弄粉絲的注意力,來盤活新項(xiàng)目,拓展新領(lǐng)域。

錘子卻在相同的時(shí)刻,處理得僅僅就像是「危機(jī)公關(guān)」,一切都是在堵漏洞,而沒有創(chuàng)造性(或者哪怕是借鑒下小米)地真正解決問題。

高手過招,點(diǎn)到為止。

上來說了這么多「問題」,是因?yàn)椤溉襞u(píng)不自由,則贊美無意義」,錘子的好其實(shí)很多人都是了解的,我重述一遍沒啥意義。

另外就是,我創(chuàng)業(yè)失敗了。目前正在找工作,關(guān)注老羅的還是比較多的,「噴一下」羅老師還是會(huì)比較能引來關(guān)注的,所以我們就「互惠」一下吧。如果讀者當(dāng)中有人能提供一個(gè)職位給眼里容不得沙子的產(chǎn)品經(jīng)理的話,歡迎給我郵件:hongsen.w 在 gmail.com。

另外,個(gè)別細(xì)心的讀者或許也要吐槽,為什么你也跟老羅網(wǎng)站一樣,明明可以文字寫的內(nèi)容,也靠圖片來顯示呢?那是因?yàn)檫@本來是一個(gè)可以當(dāng)面跟老羅講的一個(gè)幻燈片。后因見不上面,我就又轉(zhuǎn)制成了公開信了。

原幻燈片里還有附加內(nèi)容是我怎么看錘子的未來的,「(錘子)如何成為或不成為蘋果公司」和「如何看錘子手機(jī)的國際化之路,和小米是否有得一戰(zhàn)?」有興趣的同學(xué)就當(dāng)是彩蛋去下載吧。

點(diǎn)擊「這里提供了文件下載」,你可以找到這個(gè)文件。Keynote 格式的,120 兆,免費(fèi)下載,至于播放它需要的蘋果電腦就恕不提供了。

我是一名眼里容不得沙子的產(chǎn)品經(jīng)理,更是一名強(qiáng)迫癥設(shè)計(jì)師,這是我的微信公眾賬號(hào)。如果你還希望讀到類似文章(公開信),你可以通過掃描下方的二維碼關(guān)注我的公眾賬號(hào),名字就叫「強(qiáng)迫癥設(shè)計(jì)詩」,你也可以通過搜索 OCDesigner 來添加它,我會(huì)繼續(xù)在這里更新。

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

經(jīng)得住多少詆毀,就擔(dān)得起多少贊美:

微吐槽,毛病不多但實(shí)在:
《給蘋果中國的公開信!一個(gè)設(shè)計(jì)師對(duì)蘋果官網(wǎng)的微吐槽》

我不是為了吐槽,我就是認(rèn)真:
《給老羅的公開信!一個(gè)設(shè)計(jì)師關(guān)于錘子官網(wǎng)的吐槽》

發(fā)貨不發(fā)貨都要吐槽!
《給李楠的公開信!一個(gè)設(shè)計(jì)師關(guān)于魅族官網(wǎng)的吐槽》

作者:強(qiáng)迫癥設(shè)計(jì)詩(已授權(quán),未經(jīng)作者授權(quán)請(qǐng)手下留情,先謝過 :)

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱:2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計(jì)師學(xué)習(xí)平臺(tái),專注分享網(wǎng)頁設(shè)計(jì)、無線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書:史上最全的設(shè)計(jì)師圖書導(dǎo)航:http://hao.uisdc.com/book/
設(shè)計(jì)微博:擁有粉絲量95萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計(jì) ,歡迎關(guān)注獲取網(wǎng)頁設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航:全球頂尖設(shè)計(jì)網(wǎng)站推薦,設(shè)計(jì)師必備導(dǎo)航:http://hao.uisdc.com
———————————————————–
想在手機(jī)上、被窩里獲取設(shè)計(jì)教程、經(jīng)驗(yàn)分享和各種意想不到的"福利"嗎?
添加 優(yōu)秀網(wǎng)頁設(shè)計(jì) 微信號(hào):【youshege】優(yōu)設(shè)哥的全拼
您也可以通過掃描下方二維碼快速添加:

給老羅的公開信2.0!一枚設(shè)計(jì)師關(guān)于錘子官網(wǎng)的再吐槽

收藏
點(diǎn)贊

復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場(chǎng),未經(jīng)允許不得轉(zhuǎn)載。