JORG的建筑可视化网站设计,把最多的空间留给建筑图像。一个宽幅露台先开场,三列作品再接上,独立项目与文章又各有自己的文字节奏。留白的作用,是让不同尺度的空间可以慢慢被看见。
作品目录先看一处完整空间
Work页顶部只有短标题与一段介绍,下方露台图几乎横跨内容宽度。水面、躺椅、绿植和远处城市都保留了,访客可以先读到空间关系,而不只看一处材质局部。
项目名称直接跟在图后,短说明再往下,Learn more留有清楚距离。大图没有变成脱离身份的装饰,欣赏与进一步了解可以顺着同一方向进行。
下面三列项目转为较窄的竖图,分别展示室内、建筑外观和卧室。大小变化使目录有主次,也提高第二组作品的比较密度。名称和入口各自贴着对应图像,读者仍知道哪一段说明属于哪一处空间。
界达设计认为,建筑作品卡片设计可以保留主项目与普通项目的尺寸差异,但内容字段需要一致。照片比例可因构图变化,名称、服务类型和短说明应保持清楚,避免视觉节奏变成猜测作品身份。

立面页将文字放到右下,给建筑完整高度
独立展示页的建筑占左侧整段高度,入口、立面线条与庭院都出现在画面里。右侧大半留白,摘要落在下方,图片底部与文字形成对齐。这种不平均分配的版式,让建筑先被看见。
文字与照片没有重叠,对比也稳定。图里既有玻璃和树影,也有较复杂的地面纹理,若直接叠字就很容易碰上不同明暗。把摘要放在白底区域,是克制而实用的选择。
摘要写了建筑特点及图像工作的说明,属于图中的项目文案,并未另行核验。就页面层级而言,可再给项目名称和交付类型一个更容易扫描的位置,让访客不必读完整段才知道它是哪个案例。
这里的大留白适合少量精选内容,也要求真正有信息的文字。地区、对象与交付说明比泛泛赞美更能补足照片。若将这样的展示扩展为项目详情,可以沿着建筑对象和交付内容补充字段,让图片之后还有进一步了解的依据。

文章页先交代内容身份,再展开图像
文章上方显示作者和日期,下面左侧是标题,右侧是导语,建筑照片接在两栏之后。与项目页相比,它明确告诉读者:这里有一个可以阅读的论点,而不只是另一张作品大图。
导语字号与标题比较接近,却有不同宽度和位置,右边用较多文字解释主题。宽幅建筑照片继续带来空间感,飞鸟与立面纹理也给页面增加了节奏。
这种开场适合图像丰富的专业文章,正文阶段仍应回到较舒适的阅读宽度。大字可以用来提出问题,不必把全文都做成展板。文章与项目共享留白和字形,内容任务却清楚分开。

导航很小,但方向保持稳定
About us、Work、Services、Blog与Contact出现在几张页面的顶部,标志固定在左。页面主体随内容改变,外层导航没有重新发明一套形式。这给图像优先的网站留了一条稳定的方向线。
借鉴这种布局时,可以从真实内容开始:挑一个代表性项目、一组三列项目和一篇文章,检查照片裁切、摘要长度与入口位置。栏目中的作品数量变多后,再决定是否需要筛选,不能只靠增大每张图维持欣赏感。
服务网站还需要让浏览者说得清所展示的工作。漂亮图像是开始,清楚名称和交付说明帮助继续沟通。二者靠近,比在每张图上反复覆盖咨询按钮更自然。
规划建筑或空间团队的网站
如果你的团队有建筑、室内或可视化作品,网站可以同时展示图像与具体服务内容。界达设计工作室(JVDS)提供UI/UX设计与网站设计、开发服务,欢迎带着作品素材和服务清单一起梳理。