为了进一步的规范百度智能小程序平台,百度的产品经理从代码包、物料提交等方面对开发者规范机制作都做了很多要求,但是对于怎样做好百度智能小程序体验设计很多人却不知道怎么办,今天,我就来给大家就讲一下怎样做好百度智能小程序体验设计,希望大家能够从中学习到知识。


关键点1:易用性

用户在日常使用手机使用我们的百度智能小程序时,由于使用场景非常丰富和多样化导致用户的注意力容易极其容易分散,一旦分散就容易导致小程序的关闭。

开发者在设计百度智能小程序的使用流程时一定要注意三点:

流程明确简单

用户架构清晰

做到这两点以后,我们还要做到每一步操作都能提供及时的反馈。


用户架构清晰

想要构建出好的使用流程推荐各位开发者使用统一纵向导航。

百度智能小程序框架通过顶部的导航栏可以为小程序配备统一的页面纵深导航能力。

开发这个也很简单,开发者只需要标记定义“首页”即可,就可以给你一键解决。

1-1.png


百度智能小程序的使用流程图:红线为前进路径、灰线为关闭路径、蓝线为逐级返回路径。

百度智能小程序的顶部导航栏位置是固定的,他可以帮助用户定位“当前位置”,顶部导航栏名称显示了百度智能小程序页面的核心内容,用户看到顶部导航栏就知道自己在哪个环节。


正确案例

一眼就可以看到自己想买的航班以及信息

1-2-1.png



错误案例

没有具体信息,用户容易搞混

1-2-2.png1-2-2.png



正确案例

颜色舒适不炸眼,适合阅读

1-3-1.png


错误案例

颜色过于鲜艳且不美观,会导致可读性变差。

1-3-2.png


架构横向的同级信息可以使用页内标签栏。

1、底部标签的导航栏通常在首页使用,常驻屏幕底部,提供小程序2-5个顶层视图以供快速切换。

2、用户在页面标签栏切换时,页面标签栏不随页面滑动,但是却可在当前视图内浏览更多同层级的内容。


1-4.png


3、在进行百度智能小程序界面自定义时请注意信息可读性。



正确案例

颜色舒适不炸眼,适合阅读

1-5-1.png


错误案例

颜色过于暗淡艳且不美观,会导致可读性变差。

1-5-2.png


本篇文章是系列文章的第2篇,接下来会给大家讲解百度智能小程序体验设计里的设计规范和常用组件、设计原则和设计资源,请点击链接查看:

怎样做好百度智能小程序体验设计(1)

怎样做好百度智能小程序体验设计(3)

怎样做好百度智能小程序体验设计(4)

怎样做好百度智能小程序体验设计(5)


联系电话:
1585150508*
QQ交谈:
小编
站长微信:
站长邮箱: service@qingjiuzhubei.com
35.34msRequest Duration2MBMemory UsageGET seoSchool/detail{id?}.htmlRouteAuth status
    • Booting (11.66ms)
    • Application (26.2ms)
      6 templates were rendered
      • site.zixun.seoDetail (resources/views/site/zixun/seoDetail.blade.php)9blade
        Params
        0
        cateAlls
        1
        newDetail
        2
        comment
        3
        hotnews
        4
        zuixinNews
        5
        xiangguan
        6
        t
        7
        d
        8
        k
      • layouts.site.layout (resources/views/layouts/site/layout.blade.php)21blade
        Params
        0
        obLevel
        1
        __env
        2
        app
        3
        device
        4
        isMobile
        5
        errors
        6
        cateAlls
        7
        newDetail
        8
        comment
        9
        hotnews
        10
        zuixinNews
        11
        xiangguan
        12
        t
        13
        d
        14
        k
        15
        __empty_1
        16
        __currentLoopData
        17
        hotnewsVal
        18
        loop
        19
        new
        20
        cateAll
      • layouts.site.top (resources/views/layouts/site/top.blade.php)21blade
        Params
        0
        obLevel
        1
        __env
        2
        app
        3
        device
        4
        isMobile
        5
        errors
        6
        cateAlls
        7
        newDetail
        8
        comment
        9
        hotnews
        10
        zuixinNews
        11
        xiangguan
        12
        t
        13
        d
        14
        k
        15
        __empty_1
        16
        __currentLoopData
        17
        hotnewsVal
        18
        loop
        19
        new
        20
        cateAll
      • layouts.site.bottom (resources/views/layouts/site/bottom.blade.php)21blade
        Params
        0
        obLevel
        1
        __env
        2
        app
        3
        device
        4
        isMobile
        5
        errors
        6
        cateAlls
        7
        newDetail
        8
        comment
        9
        hotnews
        10
        zuixinNews
        11
        xiangguan
        12
        t
        13
        d
        14
        k
        15
        __empty_1
        16
        __currentLoopData
        17
        hotnewsVal
        18
        loop
        19
        new
        20
        cateAll
      • common.upgrade_vip (resources/views/common/upgrade_vip.blade.php)21blade
        Params
        0
        obLevel
        1
        __env
        2
        app
        3
        device
        4
        isMobile
        5
        errors
        6
        cateAlls
        7
        newDetail
        8
        comment
        9
        hotnews
        10
        zuixinNews
        11
        xiangguan
        12
        t
        13
        d
        14
        k
        15
        __empty_1
        16
        __currentLoopData
        17
        hotnewsVal
        18
        loop
        19
        new
        20
        cateAll
      • kefu.kefu (resources/views/kefu/kefu.blade.php)21blade
        Params
        0
        obLevel
        1
        __env
        2
        app
        3
        device
        4
        isMobile
        5
        errors
        6
        cateAlls
        7
        newDetail
        8
        comment
        9
        hotnews
        10
        zuixinNews
        11
        xiangguan
        12
        t
        13
        d
        14
        k
        15
        __empty_1
        16
        __currentLoopData
        17
        hotnewsVal
        18
        loop
        19
        new
        20
        cateAll
      uri
      GET seoSchool/detail{id?}.html
      middleware
      web
      controller
      App\Http\Controllers\Site\ZixunController@seoSchoolDetail
      namespace
      App\Http\Controllers
      prefix
      /seoSchool
      where
      as
      seoSchoolDetail
      file
      app/Http/Controllers/Site/ZixunController.php:197-230
      8 statements were executed12.54ms
      • select * from `new_cates` where `pid` = '3' and `new_cates`.`deleted_at` is null1.91ms/app/Http/Controllers/Site/ZixunController.php:202zzshuju
        Metadata
        Bindings
        • 0. 3
        Hints
        • Use SELECT * only if you need all columns from table
        Backtrace
        • 12. /app/Http/Controllers/Site/ZixunController.php:202
        • 20. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 54. /public/index.php:53
      • select * from `news` where `news`.`id` = '26373' and `news`.`deleted_at` is null limit 1450μs/app/Http/Controllers/Site/ZixunController.php:203zzshuju
        Metadata
        Bindings
        • 0. 26373
        Hints
        • Use SELECT * only if you need all columns from table
        • LIMIT without ORDER BY causes non-deterministic results, depending on the query execution plan
        Backtrace
        • 14. /app/Http/Controllers/Site/ZixunController.php:203
        • 22. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 56. /public/index.php:53
      • select * from `new_cates` where `new_cates`.`id` in ('139') and `new_cates`.`deleted_at` is null360μs/app/Http/Controllers/Site/ZixunController.php:203zzshuju
        Metadata
        Bindings
        • 0. 139
        Hints
        • Use SELECT * only if you need all columns from table
        Backtrace
        • 19. /app/Http/Controllers/Site/ZixunController.php:203
        • 27. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 61. /public/index.php:53
      • select * from `news` where `news`.`deleted_at` is null order by `id` desc limit 10750μs/app/Http/Controllers/Site/ZixunController.php:205zzshuju
        Metadata
        Hints
        • Use SELECT * only if you need all columns from table
        Backtrace
        • 12. /app/Http/Controllers/Site/ZixunController.php:205
        • 20. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 54. /public/index.php:53
      • select * from `news` where `news`.`deleted_at` is null order by `published_at` desc limit 10710μs/app/Http/Controllers/Site/ZixunController.php:206zzshuju
        Metadata
        Hints
        • Use SELECT * only if you need all columns from table
        Backtrace
        • 12. /app/Http/Controllers/Site/ZixunController.php:206
        • 20. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 54. /public/index.php:53
      • select * from `news` where `newscate_id` = '139' and `news`.`deleted_at` is null order by `id` asc limit 104.18ms/app/Http/Controllers/Site/ZixunController.php:208zzshuju
        Metadata
        Bindings
        • 0. 139
        Hints
        • Use SELECT * only if you need all columns from table
        Backtrace
        • 12. /app/Http/Controllers/Site/ZixunController.php:208
        • 20. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 54. /public/index.php:53
      • update `news` set `browse` = `browse` + 1, `updated_at` = '2025-09-23 12:58:57' where `id` = '26373' and `news`.`deleted_at` is null3.77ms/app/Http/Model/News/News.php:170zzshuju
        Metadata
        Bindings
        • 0. 2025-09-23 12:58:57
        • 1. 26373
        Backtrace
        • 12. /app/Http/Model/News/News.php:170
        • 13. /app/Http/Controllers/Site/ZixunController.php:210
        • 21. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 55. /public/index.php:53
      • select * from `comments` where `news_id` = '26373'410μs/app/Http/Controllers/Site/ZixunController.php:214zzshuju
        Metadata
        Bindings
        • 0. 26373
        Hints
        • Use SELECT * only if you need all columns from table
        Backtrace
        • 12. /app/Http/Controllers/Site/ZixunController.php:214
        • 20. /vendor/silber/page-cache/src/Middleware/CacheResponse.php:38
        • 54. /public/index.php:53
        web
        array:2 [ "name" => "Guest" "user" => array:1 [ "guest" => true ] ]
        api
        array:2 [ "name" => "Guest" "user" => array:1 [ "guest" => true ] ]
          _token
          yMHKZgjsqaIOYlf2hltd1oT79jdaIQwePBQ0jDJ0
          _previous
          array:1 [ "url" => "https://data.winndoo.cn/seoSchool/detail26373.html" ]
          _flash
          array:2 [ "old" => [] "new" => [] ]
          format
          html
          content_type
          text/html; charset=UTF-8
          status_text
          OK
          status_code
          200
          request_query
          []
          request_request
          []
          request_headers
          array:18 [ "cookie" => array:1 [ 0 => "Hm_lvt_767b4e8393ab59b402599f694cc019bd=1758603526; HMA...
          request_server
          array:42 [ "USER" => "apache" "HOME" => "/usr/share/httpd" "HTTP_COOKIE" => "Hm_lvt_767b4e8393...
          request_cookies
          array:4 [ "Hm_lvt_767b4e8393ab59b402599f694cc019bd" => null "HMACCOUNT" => null "laravel_sessi...
          response_headers
          array:5 [ "cache-control" => array:1 [ 0 => "no-cache, private" ] "date" => array:1 [ ...
          path_info
          /seoSchool/detail26373.html
          session_attributes
          array:3 [ "_token" => "yMHKZgjsqaIOYlf2hltd1oT79jdaIQwePBQ0jDJ0" "_previous" => array:1 [ "u...