設計師凱文 CreativeKev
設計師凱文 CreativeKev
  • 22
  • 8 914
Figma組件屬性教學|還不會用Figma component properties嗎?
本期視頻作為之前《組件全攻略》系列視頻的補充內容,詳細講解組件的四大屬性:變體(variants)、文本(Text)、布爾(Boolean)、實例互換(Instance swap)以及另一個很常用的功能--顯示內嵌實例(Espose nested instances)
視頻內容較長,大家可以選擇性觀看:
00:32 變體屬性 (Variants)
09:31 布爾屬性(Boolean)
12:48 文本屬性(Text)
14:44 實例交換屬性(Instance swap)
18:32 顯示內嵌實例(Nested instances)
มุมมอง: 83

วีดีโอ

Figma高級網頁交互動畫 | 蒙版+視差滑動
มุมมอง 14214 วันที่ผ่านมา
本期視頻通過實際案例操作,講解如何在Figma中製作遮罩和視差滑動的交互動畫。讓你的設計更加高級,更有說服力! ▼ 本期影片目錄 ▼ 00:48 頁面設計 04:07 製作蒙版動畫 08:17 添加原型交互 10:12 製作視差效果
Figma組件全攻略(三):組件庫的建立與管理|升級成為團隊核心設計師!
มุมมอง 152หลายเดือนก่อน
本次系列視頻分為三部: (一)組件的基礎操作 (二)變體的命名與管理 (三)組件庫的建立與管理 幫助大家全面掌握建立設計系統的核心部分,幫助團隊優化流程、提升效率,並讓你成為團隊中的核心設計師! ▼ 本期影片目錄 ▼ 00:30 小型項目的組件庫管理方式 03:04 組件的命名與路徑 06:30 團隊共享組件庫的建立與管理 09:47 隱藏組件
Figma組件全攻略(二):組件變體的命名與管理|建立高效的UI組件庫!
มุมมอง 159หลายเดือนก่อน
本次系列視頻分為三部: (一)組件的基礎操作 (二)變體的命名與管理 (三)組件庫的建立與管理 幫助大家全面掌握建立設計系統的核心部分,幫助團隊優化流程、提升效率,並讓你成為團隊中的核心設計師! ▼ 本期影片目錄 ▼ 00:11 什麼是組件變體Variants? 00:48 創建變體 01:50 變體的命名方式 04:30 添加變體屬性 07:56 使用變體
Figma組件全攻略(一):基礎操作|全面掌握組件的基礎操作!
มุมมอง 165หลายเดือนก่อน
本次系列視頻分為三部: (一)組件的基礎操作 (二)變體的命名與管理 (三)組件庫的建立與管理 幫助大家全面掌握建立設計系統的核心部分,幫助團隊優化流程、提升效率,並讓你成為團隊中的核心設計師! ▼ 本期影片目錄 ▼ 00:24 組件Component的功能 01:03 創建組件 01:30 使用組件 02:38 修改組件 02:55 找到主組件 03:10 覆蓋屬性 04:33 断开連接 04:47 找回主組件
UI設計中的單位是什麼?|設計尺寸與屏幕尺寸的關係是什麼?|5分鐘了解px/ppi/dpi/pt/dp
มุมมอง 161หลายเดือนก่อน
UI設計軟件中究竟在用什麼長度單位?px/ppi/dpi/pt/dp之間的關係是什麼?什麼是1080P?什麼是視網膜屏? 今天分享的是UI設計基礎知識 長度單位,以及它們之間的關聯,幫助大家了解設計如何顯示在現實設備中。以及如何解決導出的圖片不清晰! ▼視頻內容▼ 00:04 什麼是像素(Pixel)? 00:21 什麼是分辨率(Resolution)? 01:06 什麼是像素密度(ppi)? 01:44 什麼是視網膜屏幕(Retina display) 02:03 什麼是1080P和4K? 02:22 UI設計中的單位是什麼? 02:35 邏輯像素vs物理像素 02:47 蘋果系統開發中的單位 pt 03:26 安卓系統開發中的單位 dp 04:02 為什麼導出的圖標模糊不清?
Figma Auto layout自動佈局教學2024|利用Auto layout提升设计效率!|體驗新版介面 UI3!
มุมมอง 5972 หลายเดือนก่อน
什麼是自動佈局Auto layout?自動佈局教學2024! 今天分享的是Figma的核心功能 自動佈局 Auto layout。快速掌握提升效率的方法! ▼相關視頻▼ 什麼是Design token?如何利用Figma中的variable實現Design token? th-cam.com/video/W654rNYX428/w-d-xo.html ▼視頻內容▼ 00:16 什麼是自動佈局/Auto layout? 00:35 學習使用自動佈局 04:16 設置響應式組件 05:16 設置響應式頁面 05:57 AI自動佈局Suggest auto layout 06:34 自動佈局與變量variable
什麼是人機介面指南?|5分鐘了解蘋果的Human Interface Guidelines--UXUI設計師經典教科書!
มุมมอง 1302 หลายเดือนก่อน
什麼是人機介面指南?UXUI設計師該如何使用Human Interface Guidelines? 今天分享的是交互設計教科書之一的《Human Interface Guidelines》,5分鐘快速了解關於HIG的一切! ▼相關視頻▼ 什麼是Google Material Design? th-cam.com/video/dqfwQOZemeQ/w-d-xo.htmlsi=lBy6Jeqh2giRzdKr ▼視頻內容▼ 00:00 開場 00:11 什麼是Human Interface Guidelines? 01:13 設計師該如何使用Human Interface Guidelines? 02:51 Human Interface Guidelines重點內容總結
什麼是 Material Design|5分鐘了解 Google Material Design!
มุมมอง 2913 หลายเดือนก่อน
什麼是 Material Design?UXUI設計師該如何使用Material Design? 今天分享的是交互設計教科書 Google Material Design,讓你了解關於Material Design的一切! ▼相關視頻▼ 什麼是Design Tokens? th-cam.com/video/W654rNYX428/w-d-xo.htmlsi=p0E6TlkTy7SBHKEI ▼視頻內容▼ 00:00 Introduction 00:15 什麼是Material Design 01:17 設計師該如何使用Material Design 02:48 Material Design 3 總結
澳洲UXUI設計行業你想知道的一切!市場需求|敏捷式開發|年薪|面試
มุมมอง 1553 หลายเดือนก่อน
關於澳洲UXUI設計行業你想知道的一切! 本期視頻聊一聊2024澳洲UX/UI設計行業信息包括市場需求、團隊結構、敏捷開發(Agile)、薪資收入、面試流程! ▼ 影片目錄▼ 00:00 Introduction 00:29 澳洲UX/UI設計市場需求 01:47 招聘網站 02:06 產品開發團隊構架/什麼是敏捷式開發(Agile)? 04:53 澳洲UXUI設計師收入 05:38 澳洲UXUI設計師面試流程
2024 UXUI設計師都在用的AI工具|改變產品設計行業的6款AI工具
มุมมอง 2844 หลายเดือนก่อน
2024 UXUI設計師都在用的AI工具|改變產品設計行業的6款AI工具! 本期視頻介紹6款UIUX設計行業目前使用人數最多的工具,每一款都足以幫你大幅提升效率,甚至改變你的工作流程! 我會介紹每一款工具的優缺點以及在實際工作中的應用場景,以及分享一些最新的設計行業AI使用的數據調研。希望可以幫到你! ▼ 影片目錄▼ 00:27 Figma AI功能介紹 02:15 Figjam AI功能介紹 03:46 Musho使用介紹 05:18 Uizard使用介紹 06:08 Midjourney與設計 06:49 ChatGPT與設計 07:58 AI會替代設計師工作嗎? 相關視頻|什麼是響應式網頁設計(RWD)?th-cam.com/video/Zkd0NXvbeNQ/w-d-xo.htmlsi=8oYc1vw5g0GcmJyk 00:00 開場 00:27 Figma中的AI功能 0...
6個UI設計技巧讓你的設計更高級|UI設計經驗分享2024
มุมมอง 4864 หลายเดือนก่อน
6個UI設計技巧幫助你的設計從平庸到高級|UI設計經驗分享2024 今天分享的是我從過去的大大小小的項目中總結出的6個UI設計技巧。希望可以幫到大家把設計與實際項目結合,提升實戰經驗,也提高工作效率。 ▼ 影片目錄▼ 00:10 顏色使用技巧 | Colour 01:37 文字設計技巧 | Typography 03:35 間距設計技巧 | Spacing 04:33 視覺關聯性 | Proximity 05:10 一致性原則 | Consistency 06:36 UI設計終極秘密 ▼相關連接▼ 無障礙設計在線檢查:www.accessibilitychecker.org/ ▼相關視頻▼ 設計系統基礎教學:th-cam.com/video/X6qVOp4-YhA/w-d-xo.htmlsi=5xaKDuBSz8HBinAT 00:00 Introduction 00:10 顏色使用...
如何建立一個高效的設計系統?|用簡單的方法做設計|設計系統教學2024 - 進階篇 |Figma Tutorial 2024
มุมมอง 4054 หลายเดือนก่อน
如何建立一個高效的設計系統?|用簡單的方法做設計|設計系統教學2024 - 進階篇 |Figma Tutorial 2024 高級UI設計師必備技能 使用 Figma Component Properties(組件屬性) 加倍提升效率,建立一個容易管理、操作、維護的設計系統!Figma組件屬性教學2024 ▼ 影片目錄▼ 00:09 什麼是組件屬性/Component Properties 00:40 變體屬性/Variant 03:33 文本屬性/Text 05:56 布爾屬性/Boolean 07:56 實例交換屬性/Instance Swap 09:52 顯示內嵌實例/Expose Nested Instances 11:24 組件屬性使用方法總結 相關視頻|設計系統基礎篇 什麼是Design system? th-cam.com/video/X6qVOp4-YhA/w-d-x...
什麼是 Responsive Web Design 響應式網頁設計 (RWD)?响应式栅格系统详解2024 |Figma教學2024 |如何设置你的设计文件?
มุมมอง 2894 หลายเดือนก่อน
什么是 Responsive Web Design 响应式网页设计?如何在Figma中设置响应式栅格系统?响应式栅格系统详解2024|Figma教学2024 2024UI、产品设计师必掌握的知识。快速了解什么是网页设计/App设计中的Responsive layout响应式布局以及如何在Figma文件中设置一套响应式栅格系统。 ▼ 影片目录▼ 00:25 什么是网格/栅格系统 (Grid system) 01:16 什么是响应式布局(Responsive layout) 03:07 什么是断点(Breakpoint) 05:18 如何在Figma中设置响应式栅格系统 ▼ 相关内容▼ Figma教學2024|快速學習Figma基礎操作 th-cam.com/video/_YopwPMjFGs/w-d-xo.htmlsi=XjM5WQJ0JjVeJMVz 00:00 Introducti...
Figma Animation - Toggle Switch
มุมมอง 954 หลายเดือนก่อน
Figma Animation - Toggle Switch
Figma 教學 2024|高級原型設計--可交互购物App|转场动效、加载动画以及利用variable实现逻辑运算!
มุมมอง 2565 หลายเดือนก่อน
Figma 教學 2024|高級原型設計 可交互购物App|转场动效、加载动画以及利用variable实现逻辑运算!
什麼是 Design Token ?|Design Token 2024 詳解 |使用Figma variable(變量)創建顏色系統!
มุมมอง 6355 หลายเดือนก่อน
什麼是 Design Token ?|Design Token 2024 詳解 |使用Figma variable(變量)創建顏色系統!
什麼是 Design System|如何快速建立一個設計系統?設計系統基礎教學2024|设计系统基础篇
มุมมอง 7245 หลายเดือนก่อน
什麼是 Design System|如何快速建立一個設計系統?設計系統基礎教學2024|设计系统基础篇
Config 2024 年會 | Figma 2024 年會發布了哪些新功能?10分鐘看完詳細總結!UXUI設計師不能錯過!
มุมมอง 9665 หลายเดือนก่อน
Config 2024 年會 | Figma 2024 年會發布了哪些新功能?10分鐘看完詳細總結!UXUI設計師不能錯過!
Figma教學 2024 | 零基礎快速掌握Figma| 最好用的UI/UX設計軟體入門教學
มุมมอง 2.6K6 หลายเดือนก่อน
Figma教學 2024 | 零基礎快速掌握Figma| 最好用的UI/UX設計軟體入門教學

ความคิดเห็น

  • @L20243
    @L20243 3 วันที่ผ่านมา

    讲得真好,希望能继续更新,谢谢!

  • @JohnLi-d8b
    @JohnLi-d8b 5 วันที่ผ่านมา

    感谢分享!满满干货❤

  • @邓丹-u2q
    @邓丹-u2q 14 วันที่ผ่านมา

    请问导出的时候可以直接到处1倍的svg格式吗(替代同时导出1x,2x,3x)?

    • @CreativeKev90
      @CreativeKev90 14 วันที่ผ่านมา

      svg可以用的话当然好了。不过png兼容性更好,很多团队还是首选png。所以要和开发人员讨论哦

  • @JohnLi-d8b
    @JohnLi-d8b 19 วันที่ผ่านมา

    准备用在作品集中,多谢凯文

  • @qc1990
    @qc1990 19 วันที่ผ่านมา

    又是满满干货啊

  • @宋致遠
    @宋致遠 22 วันที่ผ่านมา

    太棒了!

  • @jacqueslamb8045
    @jacqueslamb8045 23 วันที่ผ่านมา

    真的要瘋狂吹奏你的影片 -- 詳細,清楚,有營養!我之前看了很多不同的影片,有些步驟跳過了,有些情況又解釋得不是很清楚,很多時另我去了dead end,很挫敗呢~ 你真的是由初學者視角去解釋,很令人安心喔~ 謝謝~ 請繼續多出教學,造福人群!

    • @CreativeKev90
      @CreativeKev90 14 วันที่ผ่านมา

      很高兴可以帮到你!多谢支持🙏

  • @fangleart
    @fangleart 23 วันที่ผ่านมา

    很棒的內容,說明非常清楚,學到很多,希望可以持續更新

  • @jacqueslamb8045
    @jacqueslamb8045 24 วันที่ผ่านมา

    bro! you save my life!

  • @wonhusky911
    @wonhusky911 25 วันที่ผ่านมา

    讚👍

  • @Joy-qi9yb
    @Joy-qi9yb 27 วันที่ผ่านมา

    支持Kevin非常好的content!🙌

  • @JohnLi-d8b
    @JohnLi-d8b หลายเดือนก่อน

    第二期视频什么时候出啊?!

  • @qc1990
    @qc1990 หลายเดือนก่อน

    中文频道中讲得最清楚的

  • @roylanders2649
    @roylanders2649 หลายเดือนก่อน

    凯文老师, 我的Figma网页上没有资源库“ 地球” 的图标, 请问如何加在上面, 谢谢!

  • @麦为天
    @麦为天 หลายเดือนก่อน

    了这么视频就这个讲得最清楚 谢谢🙏

  • @麦为天
    @麦为天 หลายเดือนก่อน

  • @davidwang6541
    @davidwang6541 หลายเดือนก่อน

    目前他的A I功能對所有的會員都開放嗎?

    • @CreativeKev90
      @CreativeKev90 14 วันที่ผ่านมา

      目前是的哦

  • @怡-c9j
    @怡-c9j หลายเดือนก่อน

    解說很詳細 謝謝~

  • @qc1990
    @qc1990 หลายเดือนก่อน

    又更新啦🎉

  • @建陞教練
    @建陞教練 หลายเดือนก่อน

    感謝您的內容,我學到很多

  • @dpbqdqbpqdpd
    @dpbqdqbpqdpd หลายเดือนก่อน

    🙌🙌好清楚的說明👏👏

  • @qc1990
    @qc1990 2 หลายเดือนก่อน

    赞👍

  • @JohnLi-d8b
    @JohnLi-d8b 2 หลายเดือนก่อน

    正在找新版界面教程这就来了

  • @JohnLi-d8b
    @JohnLi-d8b 2 หลายเดือนก่อน

    大佬终于更新了

  • @lin3710
    @lin3710 2 หลายเดือนก่อน

    請問做APP與網頁,應該以什麼尺寸作為基底,一樣直接選375 x 812嗎?

    • @CreativeKev90
      @CreativeKev90 14 วันที่ผ่านมา

      app 常用尺寸320w,375w,web常用1200,1440 没有固定尺寸。根据你的产品发布的平台和地区,做一下调研看看哪些尺寸是使用最多的

  • @GuoqingZhao-d8s
    @GuoqingZhao-d8s 2 หลายเดือนก่อน

    nb

  • @xiaohaokong3508
    @xiaohaokong3508 3 หลายเดือนก่อน

    可以讲讲苹果的hig嘛

  • @yukiazz8083
    @yukiazz8083 3 หลายเดือนก่อน

    感谢分享。想知道Kevin对figma的新界面有什么看法。保持自己的习惯用旧的好还是应该顺应变化早点适应新界面

    • @CreativeKev90
      @CreativeKev90 3 หลายเดือนก่อน

      我的figma也是最近才更新的。用过之后我觉得很多操作位置的调整其实是更加符合使用习惯和逻辑的,比如宽度被放进了autolayout里其实更合理。至于外观上 floating panel,rounded corner就见仁见智了哈哈

  • @JohnLi-d8b
    @JohnLi-d8b 3 หลายเดือนก่อน

    终于有人能讲明白了

  • @qc1990
    @qc1990 3 หลายเดือนก่อน

    感谢分享

  • @azurelan09
    @azurelan09 3 หลายเดือนก่อน

    非常棒的基礎教學,雖然是自學,但總會有很多功能不常用就忘記在哪,剛好你有提到,影片流暢教學清晰,非常適合初學者起頭!

  • @yukiazz8083
    @yukiazz8083 3 หลายเดือนก่อน

    这个同学就是我 哈哈 感谢Kevin的分享 希望后期能分享一些面试的问题和细节 非常感谢

  • @李宁-l2r
    @李宁-l2r 3 หลายเดือนก่อน

    请问怎么汉化??

  • @陳雅致-q2w
    @陳雅致-q2w 3 หลายเดือนก่อน

    獲益良多!感謝分享

  • @JohnLi-d8b
    @JohnLi-d8b 3 หลายเดือนก่อน

    原来如此 agile好像是spotify最早使用的?

  • @xiaohaokong3508
    @xiaohaokong3508 3 หลายเดือนก่อน

    对面试非常有帮助🎉感谢分享

  • @chumini0121
    @chumini0121 3 หลายเดือนก่อน

    很喜歡每一點的說明,學習到很多,謝謝

  • @3Q.Berlin
    @3Q.Berlin 3 หลายเดือนก่อน

    很喜歡你的說明,非常專業!

  • @yukiazz8083
    @yukiazz8083 4 หลายเดือนก่อน

    最近很高产啊哈哈

    • @CreativeKev90
      @CreativeKev90 4 หลายเดือนก่อน

      尽量争取周更

  • @xiaohaokong3508
    @xiaohaokong3508 4 หลายเดือนก่อน

    一键生成portfolio也太赞了❤❤

  • @JohnLi-d8b
    @JohnLi-d8b 4 หลายเดือนก่อน

    棒棒的🎉

  • @qc1990
    @qc1990 4 หลายเดือนก่อน

    哎 ai真的要改变设计行业了😢

  • @xiaohaokong3508
    @xiaohaokong3508 4 หลายเดือนก่อน

    非常有帮助!全是干货,Accessibility部分很实用,感谢分享!

  • @qc1990
    @qc1990 4 หลายเดือนก่อน

    非常棒的内容!

  • @JohnLi-d8b
    @JohnLi-d8b 4 หลายเดือนก่อน

    感谢分享!满满的干货

  • @JohnLi-d8b
    @JohnLi-d8b 4 หลายเดือนก่อน

    终于搞清楚什么是响应式了😊

  • @JohnLi-d8b
    @JohnLi-d8b 4 หลายเดือนก่อน

    看了这么视频就这个讲得最清楚 谢谢🙏

  • @qc1990
    @qc1990 4 หลายเดือนก่อน

    很细致谢谢🙏

  • @qc1990
    @qc1990 4 หลายเดือนก่อน

    That’s sick mate! Thanks for sharing

  • @wensunshinchan
    @wensunshinchan 4 หลายเดือนก่อน

    宝宝又见面了

    • @CreativeKev90
      @CreativeKev90 4 หลายเดือนก่อน

      感谢支持😊