借助 Adobe Experience Manager (AEM) Cloud 实现卓越的网站改造

借助 Adobe Experience Manager (AEM) Cloud 实现卓越的网站改造

客户介绍:
客户在香港已有超过45年的建造业培训经验,致力为香港建造业培育有专业技术、有理论基础、有安全意识、有创新意念、有工作热诚并引以自豪的优秀人才。 从行业论坛和会议到实习计划和专业社交活动,客户为学生、教师和行业专业人士提供了大量的联系、合作和交流想法的机会。

解决方案: Adobe Experience Manager (AEM) Cloud, Adobe Experience Cloud, Google Map, Google ReCaptcha, Google Analytics, Microsoft Azure AI Translator, SendGrid Email API, Swiftype Search Engine

项目背景:
客户的两个成员组织目前分别依赖两个独立的网站来向公众宣传和推广各种节目、课程和活动。然而,随着时间的推移,课程和方案的种类不断扩大,但目前的网站设计尚未跟上用户体验和运营效率方面的期望。因此,在客户的数字化转型之旅中,需要进行网站改造,以丰富关键利益相关者的体验和关系管理。

此外,目前各个网站都有自己的技术堆栈和CMS系统,这意味着编辑者需要花时间学习每个系统的操作流程。同时,每个网站都需要独立的资源来支持,比如服务器、数据库等,这会大大增加运营和维护的成本。

挑战:

  1. 过时的设计:现有网站的设计过时,不能反映该机构现代和创新的教育方法。
  2. 缺乏移动响应能力:网站没有针对移动设备进行优化,导致移动用户的用户体验较差。
  3. CMS功能有限:现有CMS没有先进的所见即所得(WYSIWYG)编辑器,限制了编辑人员快速高效更新内容的能力。
  4. 内容可重用性挑战:在网站之间重用共享内容和功能(例如课程列表、新闻和活动)的挑战构成了重大障碍。 内容作者可能会发现自己需要在多个站点上发布相同的内容,从而导致重复并可能损害数据完整性。 这种重复不仅消耗宝贵的时间和资源,而且还增加了跨平台不一致的风险。
  5. 搜索功能不足:用户在旧网站中很难搜索到自己想要的相关内容,搜索速度也比较慢,无法满足用户快速获取相关信息的需求和期望。
  6. 不统一的技术堆栈:不统一的技术堆栈使网络安全治理变得复杂,增加了网站、数据中心和其他IT基础设施的脆弱性。
  7. 内容翻译:如何快速将繁体中文内容转换为简体中文内容,提高内容制作速度并节省人力资源,是客户在本次网站改版项目中的一个重要目标。
  8. 缺乏统一的权限管理和工作流程:缺乏统一的权限管理和工作流程,导致数据混乱、工作效率低下、无法跟踪监控,存在严重的安全风险。

我们的解决方案:
此次网站重构项目的挑战涵盖网站设计、用户体验、内容管理、流程管理和网络安全治理等各个方面。以下是应对每个挑战的方法:

  1. 以用户为中心的设计:设计了直观的导航、清晰的号召性用语和视觉上吸引人的布局,以增强整体用户体验。融入专业培训、现代数码化、安全等元素,以适应该机构现代和创新的教育方法。
  2. 移动优化:针对移动设备优化网站,确保在不同屏幕尺寸和设备上提供无缝的用户体验。 采用响应式设计原则并利用适合移动设备的技术来满足越来越多的移动用户的需求。
  3. 简化的内容管理:Adobe Experience Manager (AEM) 具有一个强大的所见即所得编辑器(What You See Is What You Get,WYSIWYG),可让内容编辑者直观地创建和编辑网站内容,而无需编写或了解HTML代码。编辑者甚至可以轻松地对排版、样式和布局进行调整,并实时预览所做的更改,从而快速创建出专业水平的网页内容。
  4. 内容可重用:我们利用Adobe Experience Manager(AEM)内容片段(Content Fragment)可重复使用的技术特点,为网站设计了十几个内容片段(Content Fragment),例如新闻、活动和媒体报道等。这样将来就可以很方便的在不同页面、渠道和项目中共享和重复使用这些内容,实现了数据一致性、完整性、可重复性,提高内容管理的效率。
  5. 优化搜索功能:在设计方面,我们重新设计了课程内容和页面内容的搜索界面,使得筛选更加直观、清晰和快捷。在技术方面,我们引入第三方搜索引擎Swiftype,借助其强大的搜索算法和基础设施,有效提升搜索性能和准确性。
  6. 统一的技术堆栈:采用 Adobe Experience Manager (AEM) Cloud 云端解决方案,将来客户的所有网站都会实施到AEM Cloud上。AEM Cloud 提供完全托管的服务,负责管理基础架构、维护和更新,客户无需担心硬件、软件的管理和维护工作。AEM Cloud 可以根据流量需求自动扩展,确保系统始终具备足够的性能和可用性。Adobe 提供了严格的安全控制和合规性保障,包括数据加密、身份认证、访问控制等,确保用户数据的安全和隐私。
  7. 自动翻译:通过将 Microsoft Azure AI Translator 翻译工具集成到 AEM 中,可以快速将繁体中文内容转换为简体中文。编辑人员无需再花时间编辑简体页面,大大简化了内容制作流程。
  8. 统一的权限管理和工作流程:AEM 提供了灵活的工作流程管理工具,我们根据客户的定制化需求创建和自定义的工作流程。AEM 提供了细粒度的权限控制,我们根据客户的部门架构和管理需求,设计了可持续使用的部门管理架构,还将用户组分为阅读组、编辑组和审批组。将来,客户的IT团队可以自由地灵活地加减用户组并设置权限。

前后对比:
新 UI/UX:响应式设计兼容所有设备尺寸,富有科技感、专业感和现代感。

Before and After Comparison

新导航:信息结构更加清晰,主次分明,突出了搜索功能。

Before and After Comparison

新搜索:内容更易于查找,筛选更加简洁,搜索速度更快。

Before and After Comparison

新排版:通过组件化设计,排版变得更加灵活多变,页面更加丰富多彩。

Before and After Comparison

结果:
网站改造项目取得了成功,改版后的网站收到了用户的积极反馈,提高了用户体验,他们发现新网站更易于导航且更具视觉吸引力。AEM Cloud 平台简化了内容管理流程,使员工能够更高效地更新内容,并使网站保持最新的课程内容和消息内容。

类似案例