按鈕水平移動 Slider 製作 | Figma 教學
這集我們來製作像 "Google Travel: Explore" 上的 按鈕Slider滑動設計. 設計元素有點像 Carousel 的感覺. 教學內容包含: 按鈕製作, Open-Overlay 彈出視窗, Frame Clip Content 水平移動, 等設計方式.
設計檔: https://drive.google.com/drive/folders/1iSF50Uultus0IbNauiSxlosSK1a_INAz?usp=sharing
支持這頻道: https://ko-fi.com/alandesign
---------------------------------------------------------------------------------------------------------
0:00 設計介紹
0:34 內容大綱
1:34 設計元素設定
3:04 按鈕製作
10:00 彈出視窗 Popup Window
18:00 箭頭按鈕製作
22:40 按鈕列製作
30:00 Frame 設計裁切
34:24 按鈕Slider Component 設定
36:35 按鈕Slider 互動設計
41:13 彈出視窗各別調整
43:16 設計結尾
---------------------------------------------------------------------------------------------------------
#slider設計 #水平移動設計 #carouselSlider #carouselSlider設計 #figma教學
設計檔: https://drive.google.com/drive/folders/1iSF50Uultus0IbNauiSxlosSK1a_INAz?usp=sharing
支持這頻道: https://ko-fi.com/alandesign
---------------------------------------------------------------------------------------------------------
0:00 設計介紹
0:34 內容大綱
1:34 設計元素設定
3:04 按鈕製作
10:00 彈出視窗 Popup Window
18:00 箭頭按鈕製作
22:40 按鈕列製作
30:00 Frame 設計裁切
34:24 按鈕Slider Component 設定
36:35 按鈕Slider 互動設計
41:13 彈出視窗各別調整
43:16 設計結尾
---------------------------------------------------------------------------------------------------------
#slider設計 #水平移動設計 #carouselSlider #carouselSlider設計 #figma教學