豆瓣影片詳情頁臨摹

與其說“臨摹”,不如說是“默畫”,百度對默畫的描述是“憑記憶作畫,是熟練掌握繪畫技巧,加深結構理解的一種很好的手段。一般要求先對形象有較深入的理解,對形象的特征結構及運動規律胸有成竹,然后再憑記憶畫出來”,道理都一樣,繪畫能如此,做產品當然也適用。

不是每個人都是喬布斯,對于我來說,產品之路是先臨摹,再默畫,然后重設計,最后才創造。

1、某一個空間下內容元素多但又都不可缺少(比如短評里頭像、昵稱、評分、點贊數、時間等),此時各元素位置該如何放置?

解決方案:

有幾個元素的位置可以直接確定,優先展示頭像(識別度高),然后是昵稱(唯一識別),接下來才是評分(主體進的動作)。

點贊數我放在了頭像和昵稱下面,時間則很自然的放在頭像、昵稱、評分這一行的最右側。豆瓣的做法是將點贊數放在短評的下方左側,這里我忽略了一點,用戶在這個地方其實是可以點贊的,而我僅僅把它當做數量上的展示用,忘記了它還是一個按鈕。豆瓣做法的優點有兩處,一是邏輯上的正確,先看短評,再決定是否點贊,二是行動上的簡便,因為短評與短評之間間距較大(下面會談到),放在兩條短評中間比放在頭像和短評中間更方便用戶操作。

定好了點贊數(按鈕)的放置位置,為了平衡視覺上的差異,于是將時間也移到了下方右側,同時點贊數(按鈕)、時間都用了灰白色顯示,推測是為了弱化這些元素,從而引導用戶更關注評論內容本身。

為每一個設計行為找到回應“WHY”的依據,盡量少的拍腦袋決定。

2、單個頁面內欄目太多,要下滑許多屏才能瀏覽完,如何做好各個內容之間的區分?

解決方案:

我首先想到的是用細橫線或者卡片來做分割,但是實際操作中都否定了,豆瓣的影片詳情頁有六屏之多,而且每個欄目里面的內容也需要區分開來,畫了一下簡略的原型,滿眼的橫線實在受不了;另外就是用卡片,但豆瓣的原設計就沒有用到卡片,有很多欄目也不適合用卡片。

那么看豆瓣是怎么做的,細橫向、留白和配色混合解決。豆瓣也用了細橫線,都是用的很克制,這里說克制是因為不僅用的少(總共三條,分別在“我的評分”、“即時討論”,“短評”下),而且這些線既細又淺,難以覺察但又的確存在。留白主要用在五條短評和五條影評中間,因為留的多(已經六屏,不在乎多少了),第一眼看上去還是很好區分的,感受也不錯。配色分割有兩處,一處是更多,“更多”用了綠色的主色調,提醒用戶有更多內容的同時很巧妙區分開了各個欄目;另一處是這部片子被收集的豆列,這里整個背景色都用了灰色,很好區分,邏輯上也透露出和影片的關系不是特別緊密。

3、豆瓣電影的每部電影頁面里,影評默認只顯示前六條(網頁版)熱門影評,那如何避免出現馬太效應?(來自知乎)

解決方案:

這里可以直接去知乎看哦

http://www.zhihu.com/question/20327678

http://www.zhihu.com/question/19588679

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,335評論 25 708
  • 發現 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,241評論 4 61
  • 今年算是見識了我的整理術到底有多糟糕。 前段時間,踐行時間管理時我發現我幾年的照片沒有整理。 上上個禮拜完成了20...
    熙溪兒閱讀 153評論 0 0
  • 最近幾個月的心思,大多被工作牽住,新的工作業務繁忙,舊的工作還需要尾后處理,時間被壓縮的很有限,并因此而先后放棄了...
    凌若晨軒閱讀 316評論 0 0