起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識彈框&新頁面，各自使用場景有什么區別？
在做Web端項目的過程中，涉及到交互采用彈框還是新頁面的時候，比較糾結，到底用哪一種更好；考慮到用戶體驗的話，就需要斟酌一番了，下文我針對自己的理解談一下各自的使用場景。
彈出框
使得用戶可停留在當前頁面，頁面內容不會被刷新，響應速度更快，用戶體驗較好，但是承載量有限，信息過多則需要新頁面來展現。彈出框大概分為內容彈框、提示彈框、廣告彈框等，我根據自己的理解分別說一下。
內容彈框1：網易郵箱
點擊【舉報】，顯示如下彈窗，依然停留在當前頁面，舉報垃圾郵件的功能突出顯示，多了一層遮罩。彈框內只有加入黑名單、移到垃圾郵件兩個小的功能點；
使用場景：通常一些分支流程上的操作，內容不多，都可以使用彈框來處理；
實例參考：比如客戶管理，標注客戶級別，設置客戶狀態是否禁用，設置客戶角色，設置客戶標簽等都可以使用彈框。
內容彈框2：組織架構管理
點擊【添加部門】，顯示如下彈框，輸入部門名稱即可添加部門；
使用場景：針對后臺常用列表的新增、修改都是常用的操作，此類操作均可使用彈框，除非列表項目特別多，才考慮使用新頁面；
實例參考：比如部門管理，新增部門，修改部門、添加部門人員，設置部門負責人等，都是針對部門列表的一系列操作。
提示彈框1
操作完成以后的提示，一般來說就是一句話描述，用來告知用戶操作結果；
使用場景：針對后臺常用列表的新增、修改、刪除等，操作完畢，均可提示新增成功、保存成功、刪除成功等；
實例參考：比如角色管理，新增角色、修改角色、刪除角色，操作完畢以后，都要給用戶一定的反饋，告知用戶操作結果，此時就需要用到彈框，這時候彈框的作用主要是提示。
提示彈框2
Toast提示，相比于提示彈框1 更輕量級，大概3-5秒自動消失；
使用場景：一句話提示，并且不影響用戶的重要流程判斷，舉個例子，如果是支付頁面，提示用戶支付成功，則需要采用提示彈框1的形式，用戶關注的結果比較重要；
實例參考：比如郵件的移動到其他分組；或者說需要選擇列表項才可以進行操作，用戶沒有選擇；提交表單時發現某些輸入項不符合要求等，都可以使用Toast提示。
廣告彈框1：桌面彈框，居中或者右下角顯示
使用場景：可用于推送消息、熱點新聞、系統升級、不同終端連接通知等。
實例參考：比如QQ桌面右下角推送熱點新聞，打開QQ時候默認彈出騰訊網迷你版,QQ升級版本的時候電腦屏幕中間彈出升級公告彈框；360手機助手連接到電腦端時候自動彈出彈框，提示用戶進行下一步操作；
廣告彈框2：活動廣告
使用場景：一般用于電商類產品，活動期間采用彈框吸引用戶眼球；
實例參考：比如京東、淘寶，周年慶或者年貨節的時候，打開網站首頁則會顯示最新的優惠活動信息，以彈框形式展示
新頁面：承載量很大，內容獨立
使用新頁面，也要注意是當前頁刷新，還是新窗口打開頁面。當前頁刷新，就要善用瀏覽器自帶返回按鈕；新窗口打開頁面適用于外鏈、或者不打斷當前業務流程的情況。
新頁面1：網易郵箱
點擊【寫信】， 顯示如下頁面，寫郵件這個本身涵蓋內容較多，而且與其他頁面關聯性不大，頁面打開方式為當前頁刷新，都是郵件相關操作，返回的話使用瀏覽器自帶的返回按鈕即可；
使用場景：獨立的頁面，獨立的流程，采用新頁面來展示
實例參考：比如課程教育，小學、初中、高中課程，每個都是相對獨立的模塊，就需要啟用新頁面展示數據；還有很多功能，下屬子功能都是并列的關系，此時也需要新頁面來展示。
新頁面2：網易郵箱
查看郵箱詳情， 顯示如下頁面，郵件詳情與列表之前是有關聯的，存在層級關系，但是郵件詳情相對于每一封郵件都可當做獨立的一塊內容；頁面打開方式同樣為當前頁刷新
使用場景：跟上個頁面有層級關系，但是又相對獨立，可采用新頁面
實例參考：比如客戶管理，我們要查看客戶詳情，那就點擊客戶名稱的時候，跳轉到客戶詳情。
新頁面3：人人都是產品經理
點擊【問答】，新窗口打開天天問頁面
使用場景：與當前頁關聯性不是很大，類似外鏈的頁面，都采用新窗口打開
實例參考：比如我們需要在系統中承接一個外鏈，鏈接到百度搜索，或者說新頁面與當前頁關聯不大，為了不影響當前頁的流程，也會采用新窗口打開頁面的方法。
有句話說，小孩子的世界才分對錯，大人的世界只分利弊，這些都是自己的親身感受，不一定哪種方式就對或者錯，只能說更好或者不是太好。
對于一款產品來說，核心功能才最重要，這些外在展現形式只是錦上添花，不可否認用戶體驗也很重要，好看的界面和好用的交互都是提升用戶體驗的好方法。做好產品就是需要涉足面廣，對于自己熟悉的領域認知度深，希望跟大家一起探索好產品的未來。
本文由 @?梨花開 原創發布于人人都是產品經理。未經許可，禁止轉載。
題圖來自PEXELS，基于CC0協議
總結得很詳細了，曾經因為新增產品頁面是要彈窗還是新窗口打開，我堅持新窗口打開，但是被開發因為說后臺產品沒有前端工程師支持，他們找的框架只能彈窗，不過可以把彈窗放大，展示內容與新頁面無差給說服了 ??
彈框如果是響應式的話，體驗不是很好吧
響應式彈框，比較適合Web端的交互，更多的是后臺系統的交互，電腦與人的反饋，大多只能靠鼠標點擊。手機端App我接觸的不多，但是相對電腦，App的交互要更復雜，更多樣化。