ui設計彈窗的使用

ui設計彈窗的使用，當信息較少且重要時，采用聯動彈窗進行設計，可以讓用戶專注在當前操作中，適合信息以輸入為主的情況，今天小編主要給大家分享ui設計彈窗的使用，希望對你們有幫助!

大家都熟悉信息提交類彈窗，與其它彈窗的不同之處在于，它們有輸入和選擇操作，如我們常用的輸入驗證碼、消息回復、充值和轉賬、任務設置等。

設計似乎相對簡單，但當你驗收時，會發現問題所在，為什么別人的彈窗的體驗如此流暢，我們的操作如此復雜?

常見問題主要包括:操作鍵盤擋住輸入區域，導致交互不流暢;選擇了不適當的控件并增加了操作步驟。

左側彈窗下部分的輸入框和提交按鈕已被鍵盤遮擋了，鑒于這種情況，我們目前的解決方案是讓彈窗跟隨鍵盤，但是當信息太多時就不合適了。

使用滑動選擇控件，一次只能查看幾個地址，當你所在的城市相對落后時，就會增加運營成本。

1.采用聯動彈窗。

聯動彈窗，即彈窗與鍵盤連接，具有解決傳統彈窗遮擋內容的優點，主要用于信息少、輸入多的重要場景。

在頁面中設置發布寶貝的價格時，將價格、原價、運費、郵費等信息集合到聯動彈窗中，這樣我們就可以一步完成操作，避免了傳統彈窗中出現多個條目的情況。

TIM的待辦事項列表主要是基于信息的，采用聯動彈窗使用戶能夠集中精力于當前輸入，而不受其它操作的干擾。

2.考慮是否可設計為頁面。

當信息多時，我們需要判斷是否有必要使用彈窗進行設計，直接使用頁面設計會不會更好?那么判斷的標準實際上是由當前用戶的目的決定的。

在訪客登錄界面中使用彈窗更合適，因為用戶當前的目的是查看其它精彩的內容，采用彈窗對用戶的目的干擾較小。

由于信息量大，當前用戶的目的是發布寶貝，所以采用頁面進行設計比較適合。

3.考慮使用傳統彈窗。

傳統彈窗是我們在屏幕中央常見的彈窗，其優點是空間大，應用范圍廣，有現成的組件庫。但是，為了有一個流暢的交互效果，我們優先考慮聯動彈窗和頁面設計的方式。如果另外兩種情況都不適合才考慮采用傳統彈窗樣式。

勾選列表中新任務的日期設置是傳統彈窗樣式，雖然彈窗有很多信息，但用戶當前的目的是添加任務。如果使用頁面就會對用戶的目的造成干擾，所以采用彈窗的方式會更好。

      注：尊重原創文章,轉載請注明出處和鏈接 http://m.hebeijilong.cn/news-id-52862.html 違者必究！部分文章來源于網絡由培訓無憂網編輯部人員整理發布,內容真實性請自行核實或聯系我們，了解更多相關資訊請關注UI設計頻道查看更多，了解相關專業課程信息您可在線咨詢也可免費申請試課。關注官方微信了解更多：150 3333 6050