Grand Plaza. 商场里的一切，只隔一个 Tab

Grand Plaza 购物中心的移动应用，把活动、服务、有奖活动和优惠集中在一处。屏幕上的金额和代码均为示例内容。

来自 Figma 和 Dribbble 上原始设计的页面，使用示例数据。

Grand Plaza 是一款购物中心应用，界面为葡萄牙语。底部标签栏把应用分成 Início、Prêmios、Ofertas、Lojas 和 Perfil 五个板块，Ofertas 凸起在正中，是唯一打破水平排列的 Tab。

Figma 存档把设计过程和页面放在一起：从 v0 到 v4 的线框图、思维导图、站点地图，以及附带内容地图的用户流程。这里我把设计好的页面，和理清它们结构的那张地图并排展示。

首页把大半个屏幕留给一场活动：一张带照片的大卡片，上面有活动名称、日期和一个 Saiba mais 按钮，轮播指示器提示后面还有更多活动。卡片下方是三个服务快捷入口：购物中心地图、停车和影院，另有 Ver todos 链接通向其余服务。

Prêmios Tab 靠小票运转。有奖活动卡片用三行短句写明：已登记多少，距离赠品还差多少，距离幸运号码还差多少。Cadastrar nota fiscal 是醒目的按钮，Saiba mais 是低调的按钮，无需任何解释，下一步就很明确。

购物中心的服务多到标签栏装不下，所以 Serviços do shopping 把 14 项服务收进同一个宫格，从购物中心地图和停车，到共享办公、自行车停车架和电动汽车充电。每个优惠最终都落在自己的页面上，有折扣、优惠码、二维码和有效期，到店出示即可。

用户流程和内容地图把这套结构画成一棵页面树，从首页向外分支。文件里还保留了两个版本的原型，一个用扁平图标，一个用 3D 图标。