我在年初的時候寫了一個自己的個人網頁
用來展示創作、自我介紹還有整理其他社群平臺的連結
一整年中的空閒時間我都會去優化一下網頁的設計
現在來看發現已經跟最初的樣貌有很大的改變
所以整理了一下更改的歷程來分享
一開始我找了蠻多的設計作品網站來參考
最後決定採用把版面切成個人簡介跟畫廊的設計
大部分的排版都是用 Flex
然後如果是在手機介面的時候 兩個區塊會疊起來
使用者可以用類似通知中心的操作方式切換兩個區塊
這是二月的時候網站剛做好的樣子
那時候為了讓內容豐富所以有什麼圖片都塞
然後可以用右邊的標籤來開關顯示不同分類的圖片
還有為了增加特色
我把頭貼做成每次都會隨機產生
也特別寫了滑鼠特效跟動態背景
那時候為了讓內容豐富所以有什麼圖片都塞
然後可以用右邊的標籤來開關顯示不同分類的圖片
還有為了增加特色
我把頭貼做成每次都會隨機產生
也特別寫了滑鼠特效跟動態背景
後來做了一點小改動
把個人名片的漸層拿掉
襯線體也拿掉
然後把圖片加了不知道是幹嘛的細框框
把個人名片的漸層拿掉
襯線體也拿掉
然後把圖片加了不知道是幹嘛的細框框
到四月我想說再來改一下網站
我把不同類別的圖片改成用區塊來區分
然後因為覺得右邊那一排標籤不好看就拿掉了
變成是點擊區塊的名字可以開關分類
我把不同類別的圖片改成用區塊來區分
然後因為覺得右邊那一排標籤不好看就拿掉了
變成是點擊區塊的名字可以開關分類
五月的時候又做了一些小改動
因為隨機產生的頭貼有點慢
我索性直接改成圖片 順便弄成圓形
然後為了讓畫面整齊 我就把所有非 16:9 的圖片都刪了
另外也把手機版的介面改良
做成可以透過直覺地滑動來切換頁面
因為隨機產生的頭貼有點慢
我索性直接改成圖片 順便弄成圓形
然後為了讓畫面整齊 我就把所有非 16:9 的圖片都刪了
另外也把手機版的介面改良
做成可以透過直覺地滑動來切換頁面
七月的時候我成功寫出不同比例圖片的排版方式（讓 Flex 根據圖片長寬比伸展）
所以就把很多不同比例的圖片又放回來了
然後我把左邊名片的空間站比縮小
讓圖片有更大的顯示空間
背景的動畫效果也拿掉（反正都被圖片擋住了）
看能不能讓網站還要更快
所以就把很多不同比例的圖片又放回來了
然後我把左邊名片的空間站比縮小
讓圖片有更大的顯示空間
背景的動畫效果也拿掉（反正都被圖片擋住了）
看能不能讓網站還要更快
然後是又過了幾天以後的更動
我感覺圓角矩形比較好看就改了
還加入了新的區塊顯示方式
用來展示比較重要的 Project
我感覺圓角矩形比較好看就改了
還加入了新的區塊顯示方式
用來展示比較重要的 Project
後來我在上面加入了切換語言的介面
然後外部連結因為在手機放不下所以改移到右邊的區塊
另外還順便把畫廊裡的所有東西都標上了名字和年份
然後外部連結因為在手機放不下所以改移到右邊的區塊
另外還順便把畫廊裡的所有東西都標上了名字和年份
最後我現在在考慮要不要把網站的設計改回方角
感覺比較乾淨俐落、優雅
然後我也在想要不要把兩個區塊分開顏色的設計改掉
原本是覺得這樣比較有特色
但是感覺統一顏色可以讓空間有更自由的感覺
感覺比較乾淨俐落、優雅
然後我也在想要不要把兩個區塊分開顏色的設計改掉
原本是覺得這樣比較有特色
但是感覺統一顏色可以讓空間有更自由的感覺
達人
