KotodamaJournal
设计实践心情 · 细致Atelier

落地页上那些「很小」的交互债

官网第一屏改过好几轮:品牌要露出来,左右分区要讲清两条产品线,移入还要带一点氛围。每一轮截图回来,修的常常不是「再加一块内容」,而是抖动半像素、字色融进底、面板小得像便签这类事。

怎么堆起来的

早期布局里,两个能力框压在品牌名上,滚动条又粗又抢戏——SEO 页还没开始讲故事,视线已经被挡和噪音带走了。
分区改成居中之后,又出现新问题:移入一侧时,对侧功能说明不出现,或者毛玻璃区域小到布局发空;从边缘滑进热区时,布局来回抢状态,整屏抖一下。

导航上「组件库」「博客」一类链接,hover 时字色加深,深色底下一眼融进去,像没 hover,又像坏了。
slogan 加上之后也返工过:一开始藏着,移入才出现,信息太晚;改成常驻小字、移入放大,并让小字本身也能触发分区 hover,叙事才跟手。

设计器侧的展示模型也换过——气质不对时,再精的文案都像配错了道具。更烦的是资源更新:只覆盖静态目录有时仍看到旧模型,缓存和实际托管路径对不上,人会怀疑「是不是没改到」。

怎么还的

按体感优先级还,而不是按文件大小还:

  • 品牌让路:能力区不再永久压住刊头级品牌信号。
  • 分区交互:一侧强调背景,对侧出半透明说明;面板尺度按整屏比例重调,而不是「能塞下字就行」。
  • 运动:收敛边缘进出时的布局抖动,hover 与文案触发共用同一套选区状态。
  • 导航:hover 用对比色,不跟背景抢同一条灰度。
  • 资源:静态资源更新路径写清楚——改了源文件不等于用户看到的那一层已经换掉。

这些都不进里程碑编号,却决定试用同学愿不愿意再点「开始使用」。

一点感想

落地页的债很适合写成日记:没有戏剧性的故障栈,只有一连串「差一点」。差一点叠多了,产品就会显得不认真。认真不一定要粒子更多,把第一屏的毫米级问题还完,故事才站得住。