板規二修訂投票正在進行中,記得到電腦版網頁的進板頁面參與投票喔 。 ω。)っ
LV. 20
GP 303

【網頁UI設計】巴哈姆特首頁重新設計-新增闇黑模式/概念設計動畫

樓主 秋夜AuNight a22841756
142 -

由於巴哈的首頁看了我頭很痛
於是小弟我自己重製了一個版本
使用的軟體是Figma
直接上圖

明亮模式
闇黑模式
明亮模式
闇黑模式
整體介面上參考了國外Reddit的概念設計
由於原網頁的物件類型過多 非常複雜
所以我以icon圖標為輔助讓網頁更加清晰
部分按鈕上也採用了漸層製作
並將手機APP的部分功能設計出來
讓整體使用更加方便
明亮模式
闇黑模式
搜尋分類介面

明亮模式
闇黑模式
搜尋介面也做了更新 在搜尋時背景會模糊 讓整體聚焦於搜尋欄中
明亮模式
                                                                       闇黑模式
明亮模式
闇黑模式 登入介面
註冊介面
新增闇黑模式下的通知介面、勇者捷徑
新增登入介面、註冊介面 點擊上方登入註冊後往下滑至中間即可操作
想嘗試操作跟看無損版的可以點以下的連結
(如果要正常預覽設定請改成這樣
然後要看闇黑模式點頭像旁的月亮或下方的闇黑模式即可
預覽部分圖片可能要讀取一陣子
以及中間的圖片是可以透過滑鼠點擊左右滑動的)
以上歡迎各位指教跟提出建議
闇黑模式已製作完成
再來是動畫瘋網站的重製
感謝各位觀看

142
-
LV. 12
GP 121
2 樓 普通的人耶 lkar7979
0 -
0
-
LV. 21
GP 3
3 樓 角落的葉綠體 chloroplast0
1 -
推個
1
-
LV. 12
GP 33
4 樓 ⠀⠀ Casper55688
1 -
大推
1
-
LV. 35
GP 7k
5 樓 深海異音 hbl917070
52 -
還少了最重要的廣告
至少要塞30%才能及格
52
-
LV. 21
GP 72
6 樓 赫式HerBerT wxzjimmy4755
4 -
先不論美醜
以使用性來講 原版網頁在使用上會比較好用

你重新設計的介面簡化過度了
把一些必要資訊給省略掉了
簡化過度會造成使用者的不便

各區塊的比重也要調整
介面分佈太平均了 沒有視覺重心
還有區塊的擺放位置建議沒必要的就保持原樣
畢竟是要重新設計的介面
盡量減少使用者要重新適應介面的部分會比較好

另外說一下
介面設計要注意的一點是
一定要以使用性為優先
之後再來考慮美觀

以上是我的想法 給你參考


4
-
LV. 27
GP 99
7 樓 請給我通知 star27896499
2 -
才華洋溢
2
-
LV. 26
GP 17
9 樓 神的存在 chuoscar1472
1 -
太強啦
1
-
LV. 12
GP 17
10 樓 幽x幻 a31185367
1 -
跟鬼一樣餒
1
-
LV. 15
GP 0
11 樓 我就爛 smallred66
1 -
神串留名
1
-
LV. 35
GP 1k
12 樓 部長 iehocnrk
1 -

豪酷

1
-
LV. 32
GP 2k
13 樓 無星之夜 coy51004
1 -
1
-
LV. 21
GP 155
14 樓 偽藍 w68449187
1 -
1
-
LV. 25
GP 4k
15 樓 鴨子 (๑•ت•๑) dandingduck
1 -
ㄊㄓ看看
1
-
LV. 27
GP 569
16 樓 Dalet food861219
0 -
原本的比較好看

0
-
LV. 16
GP 223
17 樓 imthegoodest jas0no12
1 -
推一下
1
-
LV. 33
GP 980
18 樓 近藤o戳 haha1802
0 -
我覺得有點太雜亂了
都不知道該看哪裡會比較容易找到我要的資訊
0
-
LV. 17
GP 28
19 樓 石頭吐司 t510599
1 -
1
-
LV. 35
GP 1k
20 樓 雨丸✰黑魂のLife★ xajkimon477
0 -
酷耶~推5樓大大
0
-
未登入的勇者,要加入 41 樓的討論嗎?
板務人員:

7679 筆精華,前天 更新
一個月內新增 18
歡迎加入共同維護。


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】