HAIKOU LOADING STORY
00

01 骑楼与老爸茶

海口从骑楼的拱廊里醒来。

南洋立面、椰树、电动车和一壶早茶,把老城的日常尺度放在第一眼。

画面重点:骑楼柱廊 / 老爸茶 / 电动车

02 钟楼

老城时间,在水岸中央停住。

电车贴近镜头后,画面切到钟楼居中停靠。文字只在主体清楚、前景不抢画的时候出现。

停靠点:钟楼居中 / 水岸栏杆 / 桥影远景

03 云洞图书馆

白色曲面,把海风收进洞口。

椰子树快速掠过后,云洞图书馆成为稳定主体。文字避开建筑洞口,留出完整观看空间。

停靠点:云洞主体稳定 / 前景无树干遮挡

04 海湾桥影

帆影穿过世纪大桥的线条。

海口湾不是背景装饰,而是城市展开的界面:桥、船、岸线共同构成开放感。

停靠点:桥索退到边缘 / 帆船完整出现

05 港口门户

琼州海峡,把海口接入更远的流动。

吊机、船只和水面提示海口的门户属性,让滨海省会不止停留在观光想象里。

停靠点:桥索通过后 / 吊机与船只清晰

06 集装箱城市

把海风、物流和热带色彩折叠成城市符号。

片尾的集装箱建筑把港口记忆转化为图形语言,适合作为后续视觉系统的延展母题。

画面重点:集装箱建筑 / 椰林 / 滨海天际线

Symbols

把海口的城市符号变成一次可滚动的影像叙事。

海口城市符号动效网站是一个滚动叙事网页。项目以逐帧/预渲染视频作为主视觉,在滚动过程中分段呈现海口的地标、生活方式与城市气质。它不是传统城市介绍页,而是一次把城市符号转译为动态观看体验的设计实验。

Haikou scroll story / 2026

这些符号不是景点清单,而是海口的城市性格。

调研中最稳定的线索,是海口同时拥有侨乡老城、滨海公共空间、热带日常和港口流动性。网页中的符号由这些线索组合而成,让观看者从街巷生活逐步进入海湾、港口和城市天际线。

骑楼符号切图 钟楼符号切图
01

骑楼与钟楼

骑楼老街和钟楼连接海口的侨乡历史、南洋建筑和老城水岸,是项目中“城市记忆”的起点。

老爸茶符号切图 电动车符号切图 椰林符号切图
02

老爸茶与日常通勤

老爸茶、电动车、椰树和街市小吃让海口不只停留在地标层面,也呈现出慢节奏、湿热而真实的生活肌理。

世纪大桥符号切图 云洞图书馆符号切图 帆船符号切图
03

海湾公共空间

世纪大桥、海口湾、云洞图书馆和帆船共同指向现代滨海公共空间,形成老城之外更开阔的城市界面。

轮渡符号切图 港口吊机符号切图 集装箱建筑符号切图
04

港口与流动性

轮渡、吊机和集装箱延展了海口作为琼州海峡门户的身份,也让片尾的图形语言具有继续生长的可能。

从符号调研到视频生成,再到滚动网页实现。

这个项目的重点不只是最终页面,而是把城市信息转译成可观看、可停顿、可继续扩展的动态系统。

海口城市符号系统参考图
符号与运镜参考:从独立城市符号到连续镜头节奏。
01

符号提取

基于调研材料筛选骑楼、钟楼、老爸茶、云洞图书馆、海口湾、港口等高识别度符号,并统一为玩具感、低饱和的视觉语言。

02

生成连续视频

将符号组织成 15 秒左右的预渲染视频,利用前景掠过、主体停顿和镜头切换形成滚动叙事的节奏。

03

网页叙事实现

页面把视频拆成 6 个关键停顿帧,文字只在画面主体清晰时逐行出现,并在过场动画中从下到上渐隐退出。

这个系统可以继续长出不同版本的海口。

节庆版

面向春节、端午、消博会和城市活动,替换节日物件、色彩和场景节奏。

夜景版

展开骑楼夜市、海湾灯光、世纪大桥夜景和港口灯火,形成更强的夜间城市气质。

文化版

加入五公祠、火山地貌、博物馆、非遗和地方饮食,让符号系统更接近文化传播。

多语言版

保留本地词汇的同时提供英文解释,适合旅游传播、展览导览和城市形象展示。