當前位置:網名谷>計算機網絡>軟件技術>

Q+ Web 改版設計優化思路和視覺設計方案

軟件技術 閲讀(3.25W)

1、背景

WebQQ1.0最初以IM工具進入用户的視野,2.0標誌着WebQQ華麗轉身為平台型產品,3.0是我們在深化應用平台概念的定型,縱觀webQQ的演化,其獨特的產品形態一直被業內各競爭對手所仿效。 Q+Web的到來,我們將以更成熟的姿態擁抱變化,更強調平台體驗的優化。我們總結了中間的各種反覆和挑戰,並希望以此積蓄經驗和力量。

2、溯源

前期

在問題診斷階段,與產品方反覆討論,形成基礎性結論,目標推動goal-oriented的方式能保證雙方後續的討論在彼此認同的預期範圍內。

1.根據現狀與目標的偏差,清晰的描述問題,與合作方形成基礎共識。

2.與合作方確定了目標和調整範圍,確立共同的立場。

Q+ Web 改版設計優化思路和視覺設計方案

分析

我們確定了開放平台的抽象化框架,明確用户在使用平台型產品的重要接觸體驗點,以此切入,詳細分析和明確每一個基本體驗點存在的問題。

Q+ Web 改版設計優化思路和視覺設計方案 第2張

Q+ Web 改版設計優化思路和視覺設計方案 第3張

決策

定位問題後,我們開始剖析問題探求解決方案。此次改版我們面臨最大的挑戰是桌面和任務欄的改造,也是整個項目過程中反覆pk耗時最長的一個環節。

Q+ Web 改版設計優化思路和視覺設計方案 第4張

WebDesktop改版優化思路

如何幫助用户有效的管理他們自己添加的App應用,我們解決的思路從一開始就拋開目前已有的交互元素,反覆思考一個根本問題,什麼是幫助用户組織和管理數據最有效的方式?從 Windows 和 Mac OS 我們學到兩種不同的實踐方式,Windows強調資源管理器和多視圖的方式,Mac OS 更強調數據信息展示的有序性和可控性,我們對比了Web OS和PC OS,我們吸取兩者的優點,再根據Web OS產品功能的特點,提出了優化桌面管理,全局視圖為輔的優化策略。

Q+ Web 改版設計優化思路和視覺設計方案 第5張

Q+ Web 改版設計優化思路和視覺設計方案 第6張

Dock欄、任務欄的設計演化

Q+ Web 改版設計優化思路和視覺設計方案 第7張

變化

Q+ Web 改版設計優化思路和視覺設計方案 第8張

細節優化

Q+ Web 改版設計優化思路和視覺設計方案 第9張

6、視覺設計方案

最終方案

Q+ Web 改版設計優化思路和視覺設計方案 第10張

Q+ Web 改版設計優化思路和視覺設計方案 第11張

換膚

Q+ Web 改版設計優化思路和視覺設計方案 第12張

Q+ Web 改版設計優化思路和視覺設計方案 第13張

方案2 (tobyyu)

Q+ Web 改版設計優化思路和視覺設計方案 第14張

Q+ Web 改版設計優化思路和視覺設計方案 第15張

Q+ Web 改版設計優化思路和視覺設計方案 第16張

設計

Q+ Web 改版設計優化思路和視覺設計方案 第17張

Q+ Web :