MRT 板友们大家好，这是我之前尝试做的 Case Study，在这边与各位分享。由于篇幅极长，此版本经过精简，若有兴趣阅读完整版也可从下方连结至我的 Behance 和 Medium 平台阅读。
Behance - https://reurl.cc/oL3rZQ
Medium - https://reurl.cc/lVOgvd（中文版）
Medium - https://reurl.cc/D9p4me（英文版）
—————————————————————
经二十多年来的发展，那张以地理事实为基础的台北捷运路线图已逐渐复杂化。它原应加深大众对城市样貌的认知，随着发展与扩张，却成为拖累阅读效率的束缚。本案例试图探讨如何应用网格系统及色彩、字体等元素的改善提升阅读体验。针对现行图面中的元素分析、重整并改进，以另一种角度切入，创造一套提高阅读效率、最大化资讯传达本质的台北捷运路线图。
https://i.imgur.com/RcqwWH3.jpg
路线图的设计意图？
北捷路线图于 2009 年首次加入水文资讯，将图面的路线曲折至贴近地理事实，在当时可作为简易版的大台北地图以理解各地间相对关系。11 年后的今天，北捷路网规模已几乎翻倍，图面逐渐复杂且不利阅读。在行动网络发达的现代社会，各式电子地图随手可得，捷运路线图是否仍须坚持其真实地貌的反映？亦或者可向更为极端的拓扑地图形式发展？
https://i.imgur.com/2gEn2S1.jpg
所以现在有哪些问题？
目前最大问题是站名位置不统一造成视觉动线曲折。（可尝试从台北车站向右阅读至永春站）此外，车站代码的英文部分不断重复出现也降低其阅读性。可理解为这是友善色盲使用者的体贴，但相对于东京地铁的复杂至极，北捷结构相对单纯可迅速找到任一路线起迄站的英文代码。
再者，现行版的资讯未作明确分级，机捷及淡海轻轨都做了淡化缩小处理。也许为商业考量（北捷、机捷及轻轨分属不同公司营运）但这种介于显示与不显示之间的样貌的确徒增使用者误解。最后则是水文资讯，路网初期的确有助旅客了解台北地理，但随路网扩张，目前图面中的河流反造成画面混乱。
https://i.imgur.com/RFHLMxI.jpg
找出问题了，那目标呢？
捷运路网是一项快速发展的系统，可能每半年、每季就面临更新。因此这项企划旨在创造一套“标准”而非无法发展的一次性图像，并订出六个关键字作为反复检视的标准，分别为：易懂的，未看说明即可理解；有条理的，同类元素有相同的视觉逻辑；易读的，阅读动线流畅无阻；通用的，友善所有使用者；有辨识度的，可迅速掌握重点；可扩展的，未来发展有章可循。
https://i.imgur.com/qbuvlqX.jpg
以乘客的阅读体验为优先，怎么做？
第一步是设定路线结构。将性质类似、转乘率高且站距短的机捷、轻轨与猫缆提升至与北捷路线一致的资讯层级，与高铁、台铁等长站距联外交通做出区隔。以外，不再拘泥于地理真实性，尽可能减少转折次数并预留站名空间，使之视觉等距外并提升阅读效率。修改后的样貌不致使用者感到陌生，且地理相对位置仍大致合理。车站图标则延续了圆角元素，在普通站、端点站做出尺寸差异，也将人流较多的转乘站以镂空呈现使之更为突出。代码则去除重复出现的英文字母仅保留数字，搭配色彩呈现。（此阶段有许多两难抉择，详细说明在文章后段讲述）
https://i.imgur.com/Lzl13WR.jpg
字里行间的眉角
在图面中，文字可最直观地提供资讯。“Cera Pro”作为车站代码数字使用，特征鲜明的结构补足小字及多色呈现的缺陷，不再出现分不清楚 3、6、8、9 的窘境。站名中英字体则分别选择“文鼎晶熙黑”及“FF Clan”。前者的外型构成有助于辨认内容；后者相对现行字体 Helvetica 有着更良好的阅读性。
https://i.imgur.com/z5kffaC.jpg
定义了主要元素之后，细节呢？
现行版本的黄色明度过高，易造成阅读不适；而蓝、绿线则明度皆偏低且过于相似。因此在新版本中，路线色彩的明度及色相皆做了些许调整，使阅读过程更为舒适。图标尺寸也依其资讯层级优先性渐缩，以大小相对关系为使用者提供视觉暗示，可更轻易地在图面中捕捉所需资讯。
https://i.imgur.com/HeKKyFM.jpg
如何有逻辑的说明图例？
既有版本的图例虽丰富却嫌混乱：占据正中的营运模式未明确说明其意涵；车站图标说明参差不齐；周边转乘、通道与地标等说明都胡乱都塞入杂项，虽含大量讯息却颇为草率。再设计版本则将各种大众运输纳入同一区块；车站与通道说明也以更接近图面的样貌传达；地标与及营运模式则考虑到使用流程上的不符逻辑予以删除。（路线图的价值应在查询如何由 A 站至 B 站，而非传达各种营运区间或观光景点。虽非全然多余，但与其占据空间，将它放在车站、车厢中的单一路线图更为合适。）
https://i.imgur.com/ZiRoycB.jpg
做完前面这些事后，路线图变成怎样？
通过逐步分析、整理及再设计，新旧版本的对比如下。新版本的路线架构明显较为简洁而方向一致，可在路线间迅速切换视觉焦点不感到混乱；站名文字在不缩小字级的前提下确保阅读动线的流畅，与路线呈平行；各转乘站于应用镂空、放大的图标后，在众多车站中有较高显著性，可快速辨别；车站代码部分在些微放大与字体变更后，相同检视尺寸下也提升了阅读性。
https://i.imgur.com/E0Hk0vh.jpg
鱼与熊掌，如何选择？
如先前所叙，制作过程曾面临许多许多两难的抉择。这些问题没有标准答案，结果也仅为我就目前路网复杂度做出的抉择，以下列出其中最困难的两项：
1.车站代码的英文字母保留与否？
在类似案例中常有友善色盲使用者的议题，但以北捷论，路网相对简洁可轻易找到各路线端点标注，数字也可协助判断前后站关系，且完全丧失特定色彩感知能力的使用者为极少数，是否必要需要降低绝大多数使用者之阅读效率？
2.反映实际距离或精简路线结构？
新版图面中“民权西路 — 大桥头 — 三重国小”及“中正纪念堂 — 东门 — 古亭”站距明显较大，其中后者间的三角区更稍嫌不自然。最后选择这结果的原因为：比起距离失真有违使用者潜在认知，为缩短图面站距可能导致更多转折造成画面复杂化，前者是较可接受的短处。
https://i.imgur.com/X0C2TqQ.jpg
那些与现行图面有不同解读的地方
相比于日本地铁转乘步行时间动辄五分钟起，北捷大部分转乘距离皆在两分钟内。对应此时间，新版路线图针对“红树林”、“新北产业园区”做不同解读。因其闸门至闸门间距离皆在步行一分钟内且为室内空间，感受上与多数站内转乘无异故取消其标注，在使用流程上更符合“站外转乘＝要走比较远”的心理预期。此外，原先仅注记距离的“猫空缆车动物园站 — 文湖线动物园站”也比照板桥站等做站外转乘标注。
https://i.imgur.com/pyXZAYA.jpg
新版本的优势与检讨
结束了长篇分析与比较，我们在文章尾声再次检视这个再设计版本的捷运路线图之优点与缺陷：
优势：图面简明无冗余元素、视觉动线流畅符合阅读逻辑，回归呈现捷运路网资讯的原始需求，可高效率提供“自 A 站如何搭乘至 B 站”的查询功能，适合纯捷运使用者或搭配 Google Maps 使用。此外，元件设计皆有严谨的网格应用与尺寸、色彩规范，有利未来路网图的更新参考。
缺陷：距离、相对位置等地理关系失真，且无水文资讯、方位等元素，无法良好地以该路线图反推为简易版大台北地图并用以安排自驾、长距离步行等交通，不利于仅以该图作为其他捷运路网外的旅游方式参考。
https://i.imgur.com/Zrsl0Mw.jpg
文章至此，感谢各位的阅读！若有转载需求请站内信询问。