网站 · 设计概念
酒店预订体验
酒店预订设计研究，呈现房型浏览、移动端选房与预订摘要，并说明建议采用的视觉规范和界面状态。
以下是概念设计，并非客户项目。展示内容为静态效果图，名称和数据均为虚构。
设计出发点
用摄影呈现酒店的住宿环境，同时让预订信息容易查找。概念将展示型网站与专注于选房、核对信息的移动界面配合使用。
- 面向谁
- 通过电脑或手机比较房型、安排短期住宿的旅客。
- 需要考虑的限制
- 大幅图片不能挤掉日期、入住人数和价格信息。本概念展示选房与信息核对，不提供实时房态查询或支付功能。
建议的操作流程
- 01
浏览酒店
网站以客房大图介绍住宿环境，在浏览区域提供日期选择和推荐房型。
- 02
比较房型
移动端将每种房型的图片、名称、简要说明和每晚价格组合展示。
- 03
核对预订
摘要页汇总已选房型、入住日期和费用明细，供旅客决定前检查。
为什么这样设计？
区分品牌展示与预订操作
杂志式标题和大幅摄影用于表达酒店风格。预订控件采用更简洁的文字，以橄榄绿提示操作位置。
保留选择依据
预订摘要重复呈现房型及日期，旅客不用记住上一步的内容就能核对选择。
细看视觉设计
以下为建议的设计样式，均为静态示例，不是可操作功能或正式开发规范。
配色用途
暖色背景
#F7F4EC
预订操作
#454D2D
主要文字
#26291F
字体与间距
信息清楚，下一步明确。
建议用衬线标题介绍酒店，价格、日期和控件使用无衬线字体。交易信息优先保证易读，不套用装饰性排版。
主图周围保留留白，房型名称、价格与按钮则紧密分组。移动端将每种房型作为独立单元排列。
正常流程之外的状态
暂无符合条件的客房
当前日期没有符合条件的客房。请调整日期或入住人数。
已选房型
已选择花园客房。请核对入住日期和价格后继续。
日期填写错误
退房日期必须晚于入住日期。
预订摘要为什么要重复展示房型和日期？
旅客可能浏览了多个房型。摘要将最终选择、住宿日期与费用明细放在一起，方便提交前确认。它是否有助于减少误操作，需要通过真实任务测试验证。
