在即將邁入 30 歲的這一年，我離開了釀酒師的工作，準備轉職成為 UI/UX設計師 Ep.4 — 千呼萬喚始出來的作品集網站
在累積了一些作品之後，對於一個新手設計師來說最重要的莫過於一個可以展現自己的努力與能力的平台，也就是一個屬於自己的作品集網站。
剛開始要架網站的時候其實心裡有很多糾結，其中有一個決定我想是大家都曾經糾結過的，也就是網頁設計平台的選擇。我相信這個問題沒有標準答案，不過我想分享一下我當初做選擇所考量的因素和使用完之後的一些感想，也許對正在煩惱這個問題的朋友們應該也會有點幫助。
最一開始上網爬文之後發現，現在 no code 的網站設計工具真有很多選擇，不過我最後只選了三個平台進入我的考慮清單中，分別是 Squarespace、Webflow 和 Framer，雖然在決定使用了其中一項之後就沒有深入研究其他兩個工具，不過我也可以稍微分享一下試用過後的感受和做決定的原因。
● Squarespace
Sqaurespace 是我在一兩年前就開始有在使用的平台，那時候是為了要幫自己的攝影作品架一個網站，這個平台提供了非常多樣的模板選擇，讓使用者可以簡單快速的讓網站上線，以我的觀察下來 Squarespace 主要的目標客群應該是設定在影像創作者和電商平台用途上居多，但關於電商的後台功能我就沒有做深入的研究。
我後來沒有選擇使用這個平台設計自己的作品集網站，因為我自己是把作品集網站也當成是一個作品，而我對自己作品的呈現方式也比較龜毛一點，所以模板的方便性在這個情境下就反而變成了限制，當然平台也提供了使用者去依照自己需求去設計版面的空間，但我個人認為使用上的彈性還是略嫌不足。
收費方式：（註冊後享有14天的 free trial）
優點：
上手難易度低
豐富的模板選擇
可以快速的將自己的作品上架
電商的後台功能
缺點：
客製化網站互動及版面的彈性較低，較難透過網站本身來展現設計能力
適合族群：
影像創作者（尤其是有販售作品需求的創作者）
電商賣家
或是急需一個平台放上自己作品的設計師們
使用介面截圖：
Made with Squarespace：
1. Ann Gagliano
2. Mindy Nguyen
3. RyuCreative
● Webflow
Webflow 是目前非常主流的 no code 網站設計平台，有非常多的設計師都使用這個網站來製作自己的作品集網站，它強大的功能和實用性甚至讓這個平台本身也變成一項能夠放上履歷表的技術。
這個平台的特色是除了能夠在不使用程式語言的前提下設計出一個高度個人化的網站之外，如果你是對前端工程也有一定程度理解的設計師，甚至可以利用程式語言來解鎖這個平台更多的可能性。就這個特性來說，這個平台的運作邏輯和前端工程是比較接近的，所以我想練習這個工具的過程對學習 CSS 應該也是多少有些幫助。
我後來也沒有選擇使用 Webflow 來製作我的作品集網站，理由是一開始的學習成本有點高，而我又希望可以趕快架好一個網站讓我可以快點開始找工作，所以就選擇了稍微容易上手一點的Framer，但整體來說我還是非常推薦這個平台，在未來有餘力的話我應該也會把這個技能給慢慢補上。
推薦的 Youtube 教學頻道：Flux Academy
收費方式：
優點：
功能非常全面
可設計出高度個人化的作品集網站
學成之後也許是一個能夠帶來更多機會的技能（？）
豐富的網路資源
缺點：
除了學習難度偏高之外我目前沒有感覺到什麼其他缺點
適合族群：
對自己的作品集網站有高度個人化需求且有時間心力學習的設計師
本來就懂前端工程語言的設計師
使用介面截圖：
Made with Webflow：
1. milli agency
2. Liz Yau
3. Alex Beige
● Framer
Framer 也是一個功能強大的 no code 網站設計平台，從上市之後到現在都不斷的被拿來和Webflow比較，這某種程度的證明了這個工具的影響力，我最後也是選擇使用這個平台來製作自己的作品集網站。
一開始會開始使用 Framer 是因為它可以從 Figma 直接把設計好的元件直接搬到 Framer 上並且保留元件的組成細節，但在使用的過程中我發現這並不代表有了這個功能之後就不用去理解平台的運作邏輯（之後我幾乎就沒有用到這個功能了），像是對齊方式和互動設計的細節等等，所以我後來還是花了點時間才熟悉了這個平台的操作，不過好處是他的操作介面和 Figma 也滿相似的，我想降低學習成本應該也是這個平台的主要目標之一。
雖然操作的學習上比起 Webflow 來得容易（對我來說啦），但這也同時造成了它在互動設計上並沒有辦法達到 Webflow 的強度的弱勢，我認為這也是在選擇平台時需要考慮到的重要因素。
推薦的 Youtube 教學頻道：Tim Gabe
收費方式：
優點：
可以設計出高度個人化的網站
學習難度比 Webflow 來得低一點
可以從 Figma 上複製設計稿
介面和 Figma 較為相似
缺點：
相較於 Webflow 來說在網頁互動細節上比較有限制
因為是比較新的平台，網路上的教學資源比較沒那麼豐富
適合族群：
習慣使用 Figma 並且沒有學習過前端程式語言的設計師
需要在短時間內產生出高度個人化網站的使用者
使用介面截圖：
Made with Framer：
1. Love Injection
2. Algo
3. Design Studio K
當然以上的內容只是在眾多工具選擇中的冰山一角，而且選擇了工具之後挑戰才是真正開始，除了要熟悉自己選擇的工具，更重要的是要透過作品集網站來把自己與眾不同的個性、能力和經歷都用一個容易瀏覽的方式表現出來，這些都是非常勞心費時的過程，但在成功設計出一個屬於自己獨一無二的網站之後的成就感對我來說是無可比擬的，如果在讀這篇文章的你或妳也是個創作慾旺盛的設計師，應該也能理解這個心情。
最後想在這邊推薦大家沒事就多逛逛 Cofolio 和 awwwards 這兩個網站，我在煩惱找不到自己的風格的時候每天早上的第一件事都是打開這兩個網站去尋找靈感，雖然我自己的作品集網站還有很多調整跟優化的空間，但以一個只用了一個多月趕出來的成果來說我還算是滿意的哈哈哈，希望大家都能夠找到適合自己的工具和風格，打造出一個能夠展現自我的空間。
如果對 Framer 的操作有什麼好奇或不理解的地方都歡迎透過我的信箱來聯絡我，也許不是所有的問題我都能馬上解決，但多一個人一起尋找解決方法肯定是比孤軍奮鬥來的強。至於看過了我的作品集網站之後有什麼建議或是疑問也都非常歡迎來信跟我說，編輯 Case study 的部分我個人是沒什麼太大的自信，但也非常歡迎一起討論和分享心得！
Email：newweivecreation@gmail.com
Discord：newweive
Portfolio：newweivecreation.com
