Ray 🌿

Ray 🌿

38 位追蹤者
居住於台北市,熱衷網站開發和設計,認為兩者相輔相臣,致力於做到開發如同揮劍一般優雅。更多關於我:https://rayc.dev/links
37會員
31內容數
短篇奇幻作品將不定期更新。
全部內容
由新到舊
在 Instagram 看到有人分享在日本操作機器、製作寶可夢客製化衣服的貼文,聯想起先前在網上閱讀到關於 Pokémon API 的文章,一時興起也使用 PokeAPI 仿刻貼文中機器的操作介面。然而在開發過程中,發現連續抓取 905 份寶可夢資料...
Thumbnail
去年看到 Astro 剛發布時所宣稱的「用較少的 JavaScript 打造極速網站」就對這樣的框架產生興趣,那時雖然也試玩了一下,不過因為遇到一些開發初期的 bug 放棄研究。直到近期拿過去使用 petite-vue 開發的專案 — HTML Reserved Colors 來透過 Astr...
Thumbnail
2021 年可以說是 NFT 大爆發的一年了,除了名人相繼創立自己的 NFT,也有各式各樣的商業模式和額外賦能不停的被開發出來;像是主打邊玩邊賺的 (Play-to-Earn,P2E) GameFi 項目「Axie Infinity」、擁有即可兌換一天一碗且連續七天雞肉飯的「元宇宙第一雞肉飯」...
Thumbnail
2022 年 1 月的一個假日,閒逛於誠品書局,看到了皮特·蒙德里安 (Piet Mondrian) 的周邊商品 – 蒙德里安變色馬克杯 (Mondrian Color Changing Mug) 和 蒙德里安收納包,其簡潔優雅的藝術風格立刻攫住我的目光。經調查得知,身為印象派/幾何抽象畫派先...
Thumbnail
雖然知道可以透過 HTML 的 red, white, black 等顏色單字而非色票 (color code) 來使用顏色,一直以來開發上都是在找好適合的顏色後,使用 Sass 將色票紀錄到變數再做使用,不過最近接觸到 w3schools 的 HTML Color Names 才知道有將近...
Thumbnail
以前就想過要做一個展示電影的頁面,這次使用 Vue 3 搭配 GSAP,並結合自己收藏的 46 部藍光電影所做成的 API 做串接,達成能夠橫向捲動的電影購物頁面。實作上,除了藉由 CSS 屬性 `relative` 搭配 GSAP 來調整元素的 `left` 值來實現橫向捲動的功能,另外在點...
Thumbnail
我始終認為,設計與開發是一體兩面,設計本是為開發而存在,開發也是為了完成設計,兩者相輔相成、互相影響。因此在網站首頁中,使用建築圖與對設計和開發的解釋,表現自己在前端學習上,執著於兼顧清晰的設計與流暢的開發;網站設計上,我以報紙風格做為基礎,使用噪點填充背景以實現擬似紙張的質感,加入平滑滾動與...
Thumbnail
2020 下半年在全世界仍受到冠狀病毒肆虐期間,吉卜力工作室在官網四次公開合計 24 部動畫作品、共 1,178 張高畫質劇照,表示在未觸法的情形之下可自由下載使用,並且還會持續釋出過去動畫作品的劇照。由於官網的劇照呈現方式不太友好,也未在移動裝置上做排版優化,加上分批公開的作品劇照未整合在一...
Thumbnail
這次的專案為六角學院在 2021 年疫情期間舉辦的「程式體驗營」最終作業,其中使用了最近接觸的 Vite 作為專案開發和打包的工具,以及因為對 Utility-First CSS 頗感興趣,將 Tailwind 納入專案並初次使用它做開發...
Thumbnail
我並非這美術設計的原創,不過得益於 Instagram 上 @uixperience 的作品參考,才實現了這優雅計算機的外觀。在互動的部分,我讓按鍵在按下時減少陰影,並加深按鍵背景的顏色,這樣就像是真的被按了下去一樣;另外,在顯示計算結果的部分,透過 JS 增減 CSS class 的方式隨時...
Thumbnail