<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          首頁

          深入探究B端產品設計的核心

          ui設計分享達人

          一、B端用戶需求的深入理解和分析
          在當今高度信息化的商業環境中,B端產品已成為企業高效運營和持續發展的關鍵支撐。
          這些產品不僅提供工具和服務,更是企業優化流程、提升工作效率和競爭力的有力武器。然而,要打造一款成功的B端產品,關鍵在于對
          B端用戶需求的深入理解與分析。
          B端用戶,
          如企業決策者、團隊管理者和專業人員以及普通員工,他們在日常工作中處理復雜的業務流程,對數據分析、系統整合、安全性等方面有著極高的要求。
          這些用戶的獨特需求不僅體現在產品的基本功能上,更涉及到產品的易用性、可擴展性以及服務支持等多個層面。

          設計原則之一致性

          ui設計分享達人

          一致性的字面意思和使用的場景不同代表的含義也會有區別,這里主要使用在UI/UX設計中。
          UI/UX設計中一致性是指在整個應用程序或網站中使用相同的設計元素和模式。它涉及在所有頁面和屏幕上使用相同的視覺語言、布局和交互,以創造一致且直觀的用戶體驗。一致性有助于用戶了解如何瀏覽應用程序或網站,消除困惑和沮喪,并使他們更容易學習和記住如何使用產品。
          設計并非孤立的實踐。它與其他領域交織在一起,其中之一就是心理學。在設計中發揮根本作用的心理學原理是重復定律。
          這一定律的起源可以追溯到 20 世紀早期,當時德國心理學家赫爾曼·艾賓浩斯進行了開創性的研究。他的工作對理解人類記憶具有革命性意義。艾賓浩斯最著名的貢獻是“遺忘曲線”,它表明如果不嘗試保留信息,信息會隨著時間的推移而丟失。然而,他還發現,反復接觸信息會極大地影響我們記憶信息的能力。從本質上講,重復可以強化回憶。

          揭開心理學在用戶行為的奧秘

          ui設計分享達人

             心理學是研究人的內心世界的學問,它關注的是我們的思想、情感和行為是如何相互作用的?,F在,隨著大家的生活越來越好,大家都開始追求那些能讓自己心情好的東西,這就讓設計心理學變得特別火。設計心理學就像是心理學的一個小分隊,專門負責幫我們在做廣告、搞藝術創作或者是在網上賣東西的時候,更好地抓住人們的心。簡單說,就是讓我們更懂顧客,讓他們更愿意接受我們的產品和服務。
           

          產品經理如何用ChatGPT提高工作效率?給你15個例子!

          ui設計分享達人

          ChatGPT爆火一年了,但真正能在日常工作生活中高頻使用它,并且幫助自己提升工作效率的人還是太少了。我問了一些小伙伴,大都是問了幾個問題后覺得用處不大,也懶得深入研究。
          作為一名已經習慣使用ChatGPT的資深產品經理,決定整理出這大半年的使用心得,真正幫助產品經理們把AI用起來,節省出來的時間多睡會兒不香嗎?
          廢話不多說,我們開始進入正題。

          常見的B端彈窗樣式設計總結

          ui設計分享達人

          B 端產品的業務場景通常比 C 端更為復雜,因此在進行產品設計時對信息的處理方式也需要根據不同的業務場景進行設計。今天主要聊一下 B 端產品設計中彈窗設計。
          常見的B端彈窗樣式設計總結
           
           
          彈窗的定義
          彈窗是展現在用戶操作界面之上的容器,在 X 軸和 Y 軸的平行空間之上擴展了頁面的高度。是系統與用戶之間建立聯系非常重要的組成部分。它通常在用戶進行特定操作或訪問特定頁面功能時彈出,目的是向用戶展示某些信息、提供選擇或執行某些操作。
           
          彈窗使用場景
          1.  
            需要呈現的內容篇幅相對較少。
          2.  
            常用于針對某些內容進行補充說明、需要用戶處理關鍵信息、重要的警告提示等。
          3.  
            通常是由系統觸發(用戶被動接受)。
          4.  
            彈窗整體高度和寬度不做絕對的標準或規定,可以根據內容篇幅的多少和視覺的平衡度來確定,整體規范保持一致即可。
           
          總體概括為簡單和復雜兩個場景。
           
          一、場景簡單
          場景簡單包括:全局提示、氣泡確認框、警告提示、通知提醒框,通常是操作確認和系統內部自動觸發性提示時使用。
           
          1. 全局提示
          以 toast 提示居多,通常在頁面中間偏上的位置。
          常見的B端彈窗樣式設計總結
           
           
           
          2. 氣泡提示
          用于解釋難理解的功能名詞或者由于版面限制文字展示不完,利用氣泡來展示。
          常見的B端彈窗樣式設計總結
           
           
           
          3. 警告提示
          用于重點內容的警告提醒,降低用戶犯錯概率,提升用戶的使用體驗。
          常見的B端彈窗樣式設計總結
           
           
           
          4. 提示性通知彈窗:
          位置相對固定,通常出現在需要介紹說明的功能旁邊或者居頁面中間展示。
          例如,當系統發生重要更新維護或者重點功能引導時,可以顯示一個提示性通知彈窗,告知用戶當前狀態。
          類型主要包括以下三種:
          常見的B端彈窗樣式設計總結
           
           
          常見的B端彈窗樣式設計總結
           
           
          常見的B端彈窗樣式設計總結
           
           
           
          舉例:
          有贊后臺頁面
          有贊后臺頁面
           
           
           
          二、場景復雜
          1. 場景復雜|全屏彈窗
          常見的B端彈窗樣式設計總結
           
           
           
          新開頁簽(瀏覽器)
          常見的B端彈窗樣式設計總結
           
           
          為什么是全屏彈窗,而不是頁簽?
          全屏彈窗功能和頁面相似,之所以使用全屏彈窗作為頁面載體,原因就是對原觸發頁面的使用和關注并沒有結束,編輯完成后需要快速關閉當前窗口并返回到原來的頁面中去,數據可以做到實時同步。如果用新頁簽打開,則會對數據同步造成隔斷,需要二次打開頁面。頁簽是瀏覽器新開窗口,通常用于不同功能的展示。
           
           
          2. 場景復雜|非全屏彈窗
          ①中間彈窗·純文本
          確認彈窗:用于向用戶確認某個操作或決策,通常包含確認和取消兩個按鈕。例如,當用戶點擊刪除按鈕時,可以顯示一個確認彈窗,詢問用戶是否確定刪除。
          常見的B端彈窗樣式設計總結
           
           
           
          ②中間彈窗·下拉框
          下拉框:后臺將全部數據返回,下拉展示全部內容,方便用戶快捷查詢。
          常見的B端彈窗樣式設計總結
           
           
           
          ③中間彈窗·文本輸入
          文本輸入:通常用于備注等說明性內容的填寫。
          常見的B端彈窗樣式設計總結
           
           
           
          ④中間彈窗·選擇器
          包括單選和復選兩種類型,下圖以單選框舉例。
          常見的B端彈窗樣式設計總結
           
           
           
          ⑤中間彈窗·步驟條
          常見的B端彈窗樣式設計總結
           
           
           
          ⑥中間彈窗·多內容組合
          常見的B端彈窗樣式設計總結
           
           
           
          ⑦中間彈窗·左右穿梭框
          穿梭框左側通常會有分頁,為了防止用戶對已選內容造成遺忘,右側框展示已選內容進行二次核對。
          常見的B端彈窗樣式設計總結
           
           
           
          ⑧中間彈窗·上下穿梭框
          常見的B端彈窗樣式設計總結
           
           
           
          舉例:
          常見的B端彈窗樣式設計總結
           
           
           
          3. 場景復雜|抽屜
          抽屜呈現的內容篇幅介于彈窗和頁面之間,通常居右側展示。
           
          ①抽屜·純文本
          通常展示較大篇幅的說明性內容。
          常見的B端彈窗樣式設計總結
           
           
           
          ②抽屜·橫向 tab
          通常展示同一大類下,不同分類的信息內容。比如全部消息、已讀、未讀等。
          常見的B端彈窗樣式設計總結
           
           
           
          ③抽屜·縱向 tab
          常見的B端彈窗樣式設計總結
           
           
           
          ④抽屜·多內容結合
          多類型內容的聚合展示。
          常見的B端彈窗樣式設計總結
           
           
           
           
          三、其他情況
          ①強制性提示
          為了更好的了解用戶特征,提供更加優質的服務,有的系統在用戶首次使用時,會出現強制性彈窗,執行必要操作后,才可進入系統使用。
          常見的B端彈窗樣式設計總結
           
           
           
          四、彈窗使用規范
          上下左右間距大小固定,彈窗大小根據內容的多少來自動調整。
           
          ①中間彈窗
          常見的B端彈窗樣式設計總結
           
           
          常見的B端彈窗樣式設計總結
           
           
           
          ②側邊彈窗
          常見的B端彈窗樣式設計總結
           
           
          以上就是全部內容,謝謝。


          作者:西城門設計
          鏈接:https://www.zcool.com.cn/article/ZMTYyMDI5Ng==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。

          層級思維解構圖標分類體系

          ui設計分享達人

          近年來,Ul設計行業蓬勃發展,圖標設計風格更是呈現出多元化的特點,各種新穎、創意的設計風格層出不窮。圖標樣式早已從潺潺溪水變成汪洋大海,通過系統歸納和整理各類常用的面性圖標設計類型與風格,我們構建了一套體系化的記憶框架,使得在日常工作中能夠迅速且準確地作出圖標樣式的決策,從而有效提升設計效率與質量。本文章主要討論近年UI界面中會經常使用的圖標風格,線性圖標樣式組成一般過于簡單,在此不做討論。
           
          本文在探討圖標的分類思維時,巧妙地運用了層級理念,
          并特別關注層級是否穿透這一關鍵因素來區分不同類型的圖標。這種分類思維不僅使圖標的辨識變得更為便捷,還有助于人們更輕松地形成深刻的記憶印象。通過這種創新性的分類方法,我們得以更清晰地理解圖標的本質與特點,進一步提升我們對常用圖標的認知水平和應用

          B端基礎 | 52000余字總結 B 端基礎設計知識

          ui設計分享達人

          1、
          內容總結
          因為在寫這個系列的文章時我加入了很多擴展知識。希望告訴你更多。這里我會把主要的這個系列的知識總結一下讓你盡量一次看完。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          1.1、登陸頁面
           
          最近就在做我們系統的登陸頁面優化?;仡^我會寫一個項目總結給你們看。這里介紹一下B端登陸頁面該怎么去做。其實還挺簡單了。因為現在主流的布局就那幾個。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          登陸頁面:布局分為三種;居左、居右、居中
          頁面元素:導航、登錄框、背景(裝飾元素)、互聯網信息。
          導航
          高度:68px或48px、文字大?。?4(大部分)16(也可以)
          登錄框
          大?。捍笮〕叽绮唤y一、沒有固定的尺寸。可以根據自己和領導的喜好決定。對還有要承載的內容多少。
          登錄方式:掃碼、手機號、賬號、第三方
          標題切換字號:我喜歡用26px(也要其他的16、/18、/20)
          輸入框高度:48px
          按鈕文字和高度:16px、和輸入框高度一直就行。
          背景
          可以是配的插畫(這種最簡單)、一般都是科技風
          底部
          要不就是單純的互聯網信息。要不就是快捷入口、聯系方式什么。這個就不多說了正常排版就行。
           
          1.2、篩選
           
          篩選相對是很簡單的部分把、因為你直接用規范里的組件。雖然不會很優秀、但是剛重要的是不會出什么錯誤。主要是就大廠規范能夠快速的幫你解決問題。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          篩選的意義:定位數據、縮短查詢路徑、數據內容分類
           
          篩選類型:基礎篩選組件(就是我們常見的頁面頂部的篩選)、高級篩選(就是那些需要你定義想一想的篩選部分)
           
          篩選布局:頂部和左側
           
          篩選樣式:平鋪;折疊;Tab篩選;單側選擇;表頭;綜合
           
          1.3、柵格
           
          這里其實還簡單的、首先你要明白柵格在我們的設計里面很重要。你不用當然也可以呀。但是你想要做的更好那就用起來你會有意外的收獲。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          怎么用:直接看ant design、TDesign、阿科desing的規范就行、寫的很清楚。
           
          注意點:不要硬套、我們要根據自己的系統去自己定制。比如我們系統、用的是ant design的框架、但是我們的網格系統是自己定制的。因而我們的邊距不是24px、我們是20px
           
          1.4、顏色
           
          這部分相對來說是我自己的弱項、在寫當時的文章的時候也是收獲頗多的。明白了大廠規范是怎么確定自己色彩設計規范的。也清楚了自己應該怎么去規定自己的設計規范。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          主色確定:常見的方法、1、用自己品牌logo的顏色;2、用行業色
           
          配色確定:我一般是找競品、或者優秀的配色方案、來確定自己的。多參考大廠的配色方案。雖然不全是好的。但是好的還是站大多數的。
           
          大廠色彩:這里我分享了大廠的色彩是怎么去確定的、如何去確定??梢匀タ纯?。我在自己的工作中色彩的應用就參考了ant Design的色彩應用方式定制的。
           
          1.5、字體
           
          字體部分我覺得最有意思是的是分享了、我們宋體、楷體、隸屬、甲骨的發展歷史和由來。還有就是如何去設計一款自己的字體。還有后臺字體規范的制定
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          中國文字:這里中國文字的發展歷史、所有字體的產生都是有自己發展的歷史原因的。很有意思。建議你看看、可以當做你喝酒吹水的談資。
           
          字體規范:我們大部分的字體會采用黑體、可讀性強、親和、現代、清晰。
           
          字號:最新的字體12px、正文、14px、通過+2, +4,+8,+12,+16 的步數增長規律
           
          行高:通過邏輯得到這樣一個公式:「 行高 = 字號 + n 」,8 作為變量正好同時滿足與 1.5 倍的「 14px & 16px 」常用字號行高保持一致,總體文字間隙穩定呼吸,行高空間較一致得出計算公式:「line-height = font size+8」
           
          字重(就是字粗):建議使用兩種常規和加粗(在前端里一般就是400和500)
           
          顏色:我是主張帶有色彩傾向的顏色應用的。根據字體樣式的設計原則,制定了簡易好記的透明度數值區間并且將該字色與界面系統的色彩系統結合,文字顯示色彩對比滿足至少1:4.5( AA級別)。且驗證了其中的實用性,共分為亮暗兩種模式,4 個色階。
           
          1.6、ICON(圖標)
           
          你要統一風格成套的去找參考和應用。在我們的系統里我是自己畫icon的然后傳到阿里巴巴矢量圖庫讓開發直接引用。這個是自己累點、但是可以保障實現效果。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          設計原則:準確、簡單、節奏、愉悅。
           
          設計實戰:采用柵格
          我是用的阿里巴巴矢量圖庫的設計規范、因為我要傳到這個平臺應用
           
          ICON分類:交互性圖標、裝飾性圖標、說明性圖標
           
          1.7、按鈕
           
          按鈕我覺得這部分是相對簡單的、也是要做到風格的統一。直接用大廠組件然后根據自己平臺的風格、不如圓角的大小其他的倒是沒什么了。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          常規按鈕:次要按鈕、主要按鈕、文字按鈕、圖標按鈕
           
          按鈕狀態:可用、禁用、加載、懸浮
           
          尺寸:把按鈕分成:迷你、小、中、大,四種尺寸。高度分別為:24px/28px/32px/36px。推薦及默認為尺寸「中」。
           
          樣式:各個規范對按鈕形狀的規范基本都一樣。提供長方形、正方形、圓角長方形、圓形四種形狀。
           
           
          布局:這里分享了兩個概念、古登堡法則、費茨定律、告訴你我們為什么這么排版。對產品和甲方很有用、哈哈、這是我的秘訣。
           
          1.8、彈窗
           
          后臺彈窗是一個很復雜的內容、但是也是一個相對很好處理的部分。只要你做好規范這部分、簡直就是一點開胃小菜。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          彈窗是一個我頭痛的問題因為不太好規范。但是我還是把這個彈窗系統、在我們的體系中形成了一個小的規范。感謝領導、感謝前段端的龍哥。
           
          我們把前段粗略的分為400px、600、800、1000、最大、廣告。業務里我們會采用4、/6、/8、/1、最大、推廣和通知我們就統一的尺寸。
           
          1.9、表單
           
          什么是表單:我理解表單就是系統為和用戶進行交互、所要收集用戶信息的或獲得用戶反饋的一種方式的載體。在后臺產品中對我們數據做的增、刪、改、查、驗都可以通過表單完成。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          我們在后臺系統中、大部分的場景都會使用上表單。信息采集呀、編輯數據呀等。在表單設計時要遵循的原則、簡潔明了、清晰高效、適應業務、即時反饋。
           
          表單的構成結構、基本都是由、標簽、域、提示、操作按鈕這四個部分構成的。
           
          表單布局在表單中我們采用多種布局方式。信息分組、內容列表、標簽頁、分步驟。
           
          1.10、表格
           
          B端設計中,對數據瀏覽、操作、過濾、展示是最高效的。這你就不用質疑了。因為結構簡單、精準高效、數據形式豐富。
           
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          表格是用來收集、整理、組織、分析數據的二維矩陣。它由內、外兩部分組成。其中,內部包含表頭、表體、底欄等。外部包含標題、篩選區、操作按鈕區等。
           
          表格的類型:基礎表格、樹形、子表格、交叉表格、圖表表格、卡片表格
           
          表格的樣式:網格型、水平線型、斑馬紋、自由形式
           
          進階的一些知識就是表格數據的優化和表格的交互知識了。想了解去看更詳細的我的文章11表格設計和12表格優化項目實戰。
           
          1.11、大廠規范
           
          如果你是一個小廠B端設計師、剛好沒有自己平臺的設計規范。那就去直接用的場的設計規范。去用沒問題的。大廠那么多的牛逼設計給你做好了你不用。都塞到嘴巴上、不吃就不給面了。
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          在使用大廠的設計規范時然后慢慢的積累自己平臺的設計規范。逐漸的你就會形成一個屬于你們自己平臺業務的高質量設計規范了。
           
          2、計劃
           
          這個基礎系列的文章就這樣寫結束掉吧、希望可以對你的B端設計有所幫助。之后我會寫二個系列的文章、去分享我理解的B端設計。
           
          B端基礎 | 52000余字總結 B 端基礎設計知識
           
           
          第一個系列是B端基礎設計的加強版、B端高手。B端高手是會寫我的實戰里是怎么去做的。其實就是我的設計項目復盤。
           
          第二個系列就隨便的去分享一些設計知識。比如哪些什么什么原理呀、什么什么法則呀、在設計里的應用。而且會提出和討論一些設計問題。
           
           
           


          作者:彪形大漢pro
          鏈接:https://www.zcool.com.cn/article/ZMTYyMTEyNA==.html
          來源:站酷
          著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。
           
           

          新中式與AI的融合碰撞—百度二十四節氣卡設計升級

          ui設計分享達人

          隨著AI生圖時代的來臨,設計團隊致力于通過AI訓練自有設計風格的模型資產,以此來為業務提效。鑒于節氣卡的高覆蓋率、高復用率和高收益,我們選擇了這一場景進行新中式風格的升級和模型訓練嘗試。

          深度解析:如何讓設計作品擺脫平庸?

          ui設計分享達人

          在現在這個如此內卷的設計行業,越來越多的設計師在追求技法、追求設計形式上的高難度,仿佛用到的技法牛不牛逼成為了作品質量高不高的第一標準。
          但殊不知過分的追求技法、堆效果,會導致用戶閱讀作品信息的難度增大,致使設計作品的商業價值降低,最終出力不討好。
           
          所以想要提升作品出彩度、改變平庸表現有時不必大費周章,往往當你做好一些細節工作時上述問題便水到渠成的解決了,所以本期就給大家分享幾個解決此類問題的實用技巧。
           

          八角行為分析 — 打動用戶的產品密碼

          ui設計分享達人

          在當今競爭激烈的市場環境中,打造真正吸引用戶的產品和服務已成為品牌脫穎而出的關鍵。我們需要不斷地探索和挖掘用戶的需求和期望,以便更好地設計出引人入勝的產品和服務。在這個過程中,用戶動機是用戶做出某種行為和決策的核心原因,了解用戶動機心理成為產品設計中至關重要的一環。
          每一次玩法設計的過程中,我們都會為產品賦予諸多亮點。但只有和用戶需求交叉的部分才能真正驅動他們去體驗并傳播,我們可以用八角行為分析(Octalysis)來理解打動用戶的產品密碼。

          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合