常用組件的專業(yè)認識

Grace
0 評論 1658 瀏覽 18 收藏 7 分鐘
🔗 技术知识、行业知识、业务知识等,都是B端产品经理需要了解和掌握的领域相关的知识,有助于进行产品方案设计和评估

在產(chǎn)品設計過程中,我們會經(jīng)常用到一些小組件、模塊,但你知道這些組件叫什么名字嗎?這篇文章,我們來解決下這個問題。

我看身邊有很多小伙伴對很多組件有一種“看著很熟,自己設計原型時也會使用,但是卻不知道叫啥”的情況,這樣就會影響產(chǎn)品內(nèi)部以及和技術(shù)小伙伴的工作溝通。

所以基于以上情況,本次專門整理了一些常用組件的專業(yè)知識,分享給不太關注組件專業(yè)術(shù)名的“產(chǎn)品老手”以及根本就沒用過相關組件的“產(chǎn)品新手”~

Popup 彈出層:彈出層容器,用于展示彈窗、信息提示等內(nèi)容,支持多個彈出層疊加展示。支持頂部,底部,左側(cè),右側(cè)不同位置的彈出。

toast輕提示:在頁面中間彈出黑色半透明提示,用于消息通知、加載提示、操作結(jié)果提示等場景。分為文字提示、加載提示、成功提示、失敗提示、動態(tài)更新提示;可以頂部展示或者底部展示。

snackbar:比toast稍微重一點的輕量型反饋方式,包含一行與進行中的操作相關的文案&(最多)一個操作,并且snackbar不能包含使其消息的“取消”操作。

注:很多組件庫中沒有該組件,需要技術(shù)小伙伴自己來寫(例如技術(shù)常用的vant3就沒有~)

Calendar 日歷:日歷組件用于選擇日期或日期區(qū)間??蛇x擇單個日期,多個日期,日期區(qū)間。

級聯(lián)選擇框:用于多層級數(shù)據(jù)的選擇,典型場景為省市區(qū)選擇。

時間選擇器:支持日期、年月、時分等維度,通常與彈出層件配合使用。

Picker 選擇器:提供多個選項集合供用戶選擇,支持單列選擇和多列級聯(lián),通常與彈出層組件配合使用。

Rate 評分:用于對事物進行評級操作。

Slider 滑塊:滑動輸入條,用于在給定的范圍內(nèi)選擇一個值。

Stepper 步進器:由增加按鈕、減少按鈕和輸入框組成,用于在一定范圍內(nèi)輸入、調(diào)整數(shù)字。

Badge 徽標:在右上角展示徽標數(shù)字或小紅點。

NoticeBar 通知欄:用于循環(huán)播放展示一組消息通知??伤娇纱怪睗L動。

Popover 氣泡彈出框:彈出式的氣泡菜單

Tag 標簽:用于標記關鍵詞和概括主要內(nèi)容。

ActionBar 動作欄:用于為頁面相關操作提供便捷交互。

Tab 標簽頁:選項卡組件,用于在不同的內(nèi)容區(qū)域之間進行切換。

Tabbar 標簽欄:底部導航欄,用于在不同頁面之間進行切換

TreeSelect 分類選擇:用于從一組相關聯(lián)的數(shù)據(jù)集合中進行選擇。支持單選和多選模式

此次分享到此結(jié)束,歡迎小伙伴留言分享其他常用但是很多小伙伴不容易叫上名字的組件~

本文由 @Grace 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自Unsplash,基于 CC0 協(xié)議。

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務。

更多精彩內(nèi)容,請關注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!
专题
87440人已学习18篇文章
沉住气,学做事,更要学会做人。
专题
112344人已学习29篇文章
透过别人的项目总结,学习项目管理项目设计项目流程经验。
专题
14202人已学习13篇文章
互联网IT技术与产业的结合,衍生出了许多生命力强大的平台经济,货运领域就是如此衍生而来的。本专题的文章帮助大家了解货运平台。
专题
12763人已学习13篇文章
在产品的不同生命周期,需要有对应的产品战略以应对市场。本专题的文章分享了如何做好产品战略规划。
专题
17249人已学习14篇文章
本专题的文章分享了如何设计B端SaaS产品及B端SaaS产品方法论。
专题
11582人已学习12篇文章
任何理论都有它的局限性和前提条件,没有一种方法论是永远有效的。品牌方法论一直处在变化阶段,它随着时代发展的变化而变化。本专题的文章分享了品牌方法论。