亚洲欧美中文日韩v在线观看不卡,亚洲精品一区二区三区的,亚洲精品国产一区二区三区在线观看,亚洲成a人片在线观看无码专区,亚洲人成人无码网www国产

服務(wù) 服務(wù)
我們的服務(wù)

我們的服務(wù)融合了運營、技術(shù)、媒體、內(nèi)容等多個領(lǐng)域的專業(yè)力量，為企業(yè)提供專業(yè)的數(shù)字營銷解決方案，助力企業(yè)實現(xiàn)可持續(xù)增長。

一分鐘了解我們做什么？
網(wǎng)站開發(fā)服務(wù)

企業(yè)網(wǎng)站

外貿(mào)獨立站

功能型網(wǎng)站
移動開發(fā)服務(wù)

IOS/安卓APP

微信小程序

UI/UX設(shè)計
數(shù)字營銷服務(wù)

SEM效果提升

SEO排名優(yōu)化

新媒體營銷推廣

中小企業(yè)全鏈營銷
案例案例
觀點觀點
關(guān)于關(guān)于
關(guān)于我們

我們是一家以增長為導(dǎo)向的數(shù)字營銷服務(wù)商，業(yè)務(wù)涉及品牌數(shù)字化建設(shè)、企業(yè)官網(wǎng)建設(shè)、移動應(yīng)用程序開發(fā)、搜索引擎營銷、新媒體營銷、增長咨詢等服務(wù)。

了解更多
公司簡介

我們的團(tuán)隊

公司動態(tài)

加入我們

聯(lián)系我們
GUED，一切圍繞用戶體驗進(jìn)行價值設(shè)計

進(jìn)一步了解GUED

老孟：讓增長超人成為“企業(yè)的第二市場部”

我們的故事
聯(lián)系聯(lián)系

中文

獲取方案

數(shù)字營銷全面診斷，定制專屬增長方案

獲取方案

0755-8232 6831 業(yè)務(wù)咨詢

在線咨詢

力本設(shè)計

設(shè)計公司的官網(wǎng)如何做到好用又好看？

行業(yè) 空間設(shè)計

服務(wù)類別建筑設(shè)計 / 校園設(shè)計

已上線，網(wǎng)址在文章底部

項目背景

為了改變以往設(shè)計企業(yè)網(wǎng)站的標(biāo)簽，即“個性”和“不一樣”，我們將從網(wǎng)站的視覺、架構(gòu)和內(nèi)容策劃方面進(jìn)行優(yōu)化。過于追求差異化會導(dǎo)致訪客的瀏覽體驗變差，因此我們以提升用戶體驗為出發(fā)點，高效地展示企業(yè)實力。

投資回報率

訪客停留時長
增長

216%

有效詢盤率
增長

112%

網(wǎng)站流量
增長

583%

產(chǎn)品經(jīng)理和UI設(shè)計師
在討論力本官網(wǎng)的改版思路

在經(jīng)過多次的項目會議研討，我們總結(jié)出：

對于力本官網(wǎng)來說，需要著重于力本的設(shè)計案例呈現(xiàn)。我們決定從視覺交互、網(wǎng)站架構(gòu)和內(nèi)容策劃三個方面入手，讓訪客能快速、準(zhǔn)確閱讀所需要的案例。

01.

視覺交互

提升視覺效果，提升品牌形象的高級呈現(xiàn)

02.

框架設(shè)計

優(yōu)化訪客體驗，提高訪客瀏覽體驗和滿意度

03.

內(nèi)容策劃

強化內(nèi)容展現(xiàn)，提升產(chǎn)品價值的傳達(dá)效率

視覺交互視覺交互

框架設(shè)計框架設(shè)計

策劃內(nèi)容策劃內(nèi)容

呈現(xiàn)設(shè)計的高級感

力本網(wǎng)站的整體視覺非常的干凈、規(guī)整，配色十分嚴(yán)謹(jǐn)，基本上也沒有什么炫酷的動效，
但整體觀感上讓人非常舒服。

我們把美的東西都放在了細(xì)節(jié)里
這種設(shè)計上的克制反而更能體現(xiàn)出高級感

視覺交互

平衡視覺與交互

優(yōu)秀的視覺和交互設(shè)計都能有效提升內(nèi)容傳播效率，可是當(dāng)兩者發(fā)生沖突時怎么辦，到底是視覺上舍棄多一點還是交互上舍棄多一點？

為了最大程度保證頁面的美觀，同時讓更多的案例能夠被訪客看到，我們在重點頁面案例的展示上用了下方這樣的可以自由移動的箭頭按鈕來進(jìn)行切換。

意想不到的交互驚喜

我們在做視覺與交互設(shè)計時，不光要有視覺美感，也有趣味性，加一點輕微的交互驚喜，能夠達(dá)到意想不到的效果。

在關(guān)于我們的介紹中，我采用了類似“頁中頁”的效果，讓訪客在瀏覽中保持對內(nèi)容的專注。

視覺交互視覺交互

框架設(shè)計框架設(shè)計

策劃內(nèi)容策劃內(nèi)容

XYZ空間軸的設(shè)計策略
提高用戶體驗

我們通常給界面添加三個方向上的軸：X、Y、Z軸。X軸指水平方向上的軸線，Y軸指豎直方向上的軸線，以及Z軸指在二維空間中垂直于視窗平面的軸線。

當(dāng)設(shè)計元素較多的界面時，讓元素沿著這一個軸進(jìn)行布局，就能很好得理清我們搭建構(gòu)架的設(shè)計思路，也使整體的元素展示變得更有邏輯。

X 空間軸

X軸上應(yīng)該更注重內(nèi)容的延伸以及適配，多分辨率下保持合理布局，將橫向增長空間最佳化。

Y 空間軸

通過Y軸，可以合理搭配翻頁，加載等邏輯，可以有序展示更多信息。

Z 空間軸

從平面的二維到三維空間的架構(gòu)設(shè)計，合理優(yōu)化模塊疊加順序，提高用戶體驗。

X 空間軸
全設(shè)備布局與適配

X 空間軸

結(jié)構(gòu)化的適配規(guī)則

用戶終端分辨率尺寸多樣，視窗寬度可變的情況下，案例呈現(xiàn)為重點的網(wǎng)站，X軸上應(yīng)該更注重內(nèi)容的延伸以及適配，將橫向增長空間最佳化。

比如案例模塊，我們就采用這種多欄型的結(jié)構(gòu)展示，這種結(jié)構(gòu)適用于同一界面需要呈現(xiàn)大量元素的排版，當(dāng)視窗大小被改變時，每個模板的大小也相應(yīng)地等比拉伸，列數(shù)不增加，讓內(nèi)容也能清晰展示。

更舒適的適配界限

遵循了以上的適配規(guī)則的同時，我們也為此做了適配的界限，當(dāng)視窗縮小到非常窄時，為了確保訪客的正常瀏覽，頁面元素則不再跟隨縮小，而是鋪滿窗口，整體伸縮的呈現(xiàn)。

Y 空間軸
合理視覺動線與高效信息承載

合理視覺動線

簡單高效的瀏覽順序，利于用戶快速了解網(wǎng)站信息，降低對內(nèi)容理解負(fù)擔(dān)，因此網(wǎng)站內(nèi)頁采用符合用戶的瀏覽習(xí)慣的的合理視覺動線。

瀑布流緩動

相較于通過點擊按鈕查看更多，這種瀑布流的展示方式，可以極大提高用戶瀏覽更多案例的可能性，避免了訪客因為翻頁而跳出。

而且，每一個案例和配圖都足夠精美，瀏覽的時候你甚至?xí)械竭@是一場視覺盛宴。

Z 空間軸
優(yōu)化模塊疊加的順序

這部分我們則從平面的二維到三維空間的架構(gòu)設(shè)計。
一般常見的元素比如有：吸頂?shù)膶?dǎo)航、菜單浮層等等，都是Z軸上的元素

b.固定類

c.浮層類

a.展示類

Z 空間軸

a層：展示類的微動效呈現(xiàn)

展示層是頁面中默認(rèn)就存在的、不會對其它元素造成遮擋的元素。
這一層的重點，無非是需要將力本最具代表性的建筑設(shè)計案例實拍、企業(yè)實力等，更全面向客戶呈現(xiàn)出來。配合上自動播放的微動效，簡短的文案，才能讓訪客高效吸收到企業(yè)核心。

b層：固定類元素吸引用戶

固定類即為固定在頁面某處的元素，或滑動頁面時會出現(xiàn)，并對a的元素產(chǎn)生遮擋。常見的有吸頂導(dǎo)航、固定表頭/列、返回頂部按鈕等。

c層：浮層類元素協(xié)助用戶

c層則是由b中的元素觸發(fā)出的或是指向該元素的臨時浮層元素，會對a層以及固定元素產(chǎn)生遮擋。臨時浮層之間的Z軸層級遵守觸發(fā)的時間先后順序，若臨時浮層可以同時存在在界面中，則后觸發(fā)的層級更高。

視覺交互視覺交互

框架設(shè)計框架設(shè)計

策劃內(nèi)容策劃內(nèi)容

在內(nèi)容策劃中，我們使用結(jié)構(gòu)化思維來設(shè)計和分析內(nèi)容，以了解用戶的心理和滿足他們的需求。一個產(chǎn)品的成功需要滿足一些必要條件，比如“我們希望用戶做什么”，以及“用戶可以用這個產(chǎn)品做什么”。

解構(gòu)必要條件

我們需要通過從結(jié)果倒推的方法，分解影響訪客的因素，并找出其中的必要條件。簡單來說，就是我們必須做哪些事情才能吸引訪客，并實現(xiàn)轉(zhuǎn)化用戶的目標(biāo)。就像增長超人提出的“高層建設(shè)營銷法則”，要建造一座高樓，屹立不倒需要考慮很多因素，而了解用戶需求則是其中最基本的條件之一。