《Magento to Shopify: Bluegg如何将客户转化率提高40%

Magento to Shopify

成功迁移之后Character.com从Magento到Shopify,团队在Bluegg他们说,他们从自己的第二个电子商务项目中获得的最大收获是,他们贪多嚼不烂……但以最好的方式。

Bluegg网站开发者Matt Jackson解释道:“这无疑是一个陡峭的学习曲线。“但现在,我不再害怕承担任何Shopify项目,因为我们从这份工作中学到了很多东西。”

Character.com有一个复杂的在线商店,有许多欧宝体育官网入口首页Magento的集成,成千上万的产品,坚实的搜索引擎优化排名不容打乱。尽管其糟糕的用户体验、移动体验和网站导航,但该公司的客户基础是忠诚的,喜欢产品。

“考虑到商家已经有了一个成功的网站,我认为我们的压力很大,”马特说。

这家总部位于英国卡迪夫的数字机构从事品牌和网页设计业务超过14年,他们的工作非常艰巨。

但是,这个团队不仅在重新平台的过程中获得了双倍的电子商务教育,他们还帮助网站的整体转化率提高了40%,并密切关注着Character.com仅在重新推出三个月后就升级到Shopify Plus计划。他们是这样做的。

关于Character.com

顾名思义,Character.com是一家销售儿童和成人角色服装的在线零售商。

马特解释说:“无论是小猪佩奇睡衣还是睡美人拖鞋,你都可以在网站上找到所有最受欢迎的角色。”

在加入Shopify之前,Character.com业绩良好,通过多个在线渠道销售产品,包括自己的专用网站。但商家希望减少对第三方市场的依赖,提高品牌知名度,并使ob欧宝娱乐app下载地址Character.com人物服装的“必去之地”。

这时他们找到了蓝蛋。

Bluegg的创意总监兼项目经理Tom Lloyd解释道:“这肯定已经在总监的脑子里了。“我认为他还没有做决定,但他非常愿意相信,搬到Shopify是一个好主意。”

尽管这只是蓝蛋的第二个电子商务项目,但基于他们在用户体验设计、各种平台的网页开发和其他数字作品方面的背景,该机构相信他们能够满足客户的需求。

Character.com最近更新了他们的logo,但同意在Bluegg的帮助下全面重新设计、重组和重建网站。

Magento to Shopify: old character.com截屏
的截屏Character.com的旧主页。

Tom解释说,在重新设计和重建过程中,他的团队试图解决三个关键问题:

  1. 这个设计过时了,而且歪曲了业务。“虽然他们卖的产品相对便宜,但他们的质量比老网站在外观和感觉上要高得多。”
  2. 旧网站在搜索、相关条目的发现、类别和产品的组织等方面存在几个关键的用户体验问题。它在技术上也不充分;尽管超过60%的游客使用移动设备,但它没有反应。Tom补充道:“令人惊讶的是,他们的转换率仍然很高。
  3. 该站点运行在Magento上,Magento是经过多年开发的。“作为一个每月销售数万件产品的企业,改变电子商务平台是一项艰巨的任务,”汤姆说。但Magento已经变得难以管理,服务器在越来越多的用户的压力下吱吱作响。更不用说不断增加的服务器成本了。
迁移后,Magento转至Shopify: character.com
什么Character.com的主页是迁移后的样子。

当谈到推销迁移时——这个项目最大的难题——汤姆说,与一个准备做出改变的商人打交道是有帮助的。但是,在向商人推销这样一个庞大的项目时,有几个要点需要记住:

  1. 不要强迫别人.汤姆说:“如果人们对已经拥有的东西感到满意,就很难把他们推进未知的领域。”做一些侦察工作,询问客户他们在哪里,他们如何发现他们当前的系统是聪明的。但是,理解和接受客户的真实需求是建立健康和繁荣的客户关系的关键。
  2. 一定要实现它.“我们很小心,不会做出任何承诺,”汤姆解释道。我们的做法通常是,“是的,我们可以这么做,但我们会告诉你怎么做。”这通常是Bluegg与客户交谈的方式,除非他们非常确定自己想要如何处理一个项目。“如今网络变化太快了,你一个月前向客户承诺的东西,这个月可能就不是最好的方式了。”
  3. 了解你的东西.汤姆说:“你对产品的任何程度的了解都将有助于你自信地谈论客户为什么应该做出改变,特别是与其他系统的优缺点。”当谈到Character.com项目中,客户考虑到改用Shopify的财务影响,并权衡了每月的费用和Magento网站上的服务器账单。“他的服务器账单飙升,”汤姆解释道。“所以很明显,Shopify没有服务器成本。”

你可能还会喜欢:Pixel Union如何实现服务产品的多元化和10倍业务

设计和用户体验的方法

除了从Magento迁移到Shopify之外,该网站还需要从设计和用户体验角度进行彻底的改革。

“基本上,旧网站最大的问题是它看起来真的过时了,”汤姆解释道。

作为他们的首批大型电子商务项目之一,团队有很多东西需要学习。Bluegg的首席网页设计师彼得•戴尔(Peter Dyer)通过分析业内一些最好的电子商务网站正在做的事情,寻找灵感。他们最终决定采用一种充满活力而又简单的外观和感觉,将产品置于舞台的中心。

“从设计的角度来看,这是关于试图提取网站的最好的部分,”彼得说。“蝙蝠侠、复仇者联盟、小猪佩奇——它们作为设计元素本身看起来都很可爱,我们认为我们应该让这些元素发光发热。”

“从设计的角度来看,这是关于试图提取网站最好的部分。”
Magento to Shopify:项目网页设计师
该项目的网页设计师彼得的目标是一个充满活力的设计,把产品放在舞台的中心。

该团队决定先设计移动平台,这导致了网站结构的重要决策。奇怪的是,接近60%Character.com的流量来自移动端,尽管该网站对移动端不友好。

Tom说道:“他们在非手机网站上的转化率非常高。“这给了我们一点信心,因为如果人们通过手机访问我们的网站,仍然在购买东西,他们一定是真的喜欢这个产品。”

Magento to Shopify:旧网站不适合移动设备
Character.com谷歌的旧网站对移动设备并不友好。前一个产品页面截图。

Bluegg团队从一些用户研究开OB欧宝娱乐APP始,分析了网站的用户。因为商家有一个庞大的客户基础,通常有大量的订单,团队在谷歌Analytics中有很多可以使用的数据,例如性别和年龄。

汤姆说:“我们基本上发现,大多数人都是女士,而且通常年龄稍大一些,因为他们为侄子、侄女和孙子孙女买东西。”

有了对用户的清晰了解,Bluegg能够在InVision以一系列用户旅程为原型,并缩小分类和寻找产品的最佳方法。

Tom解释道:“在那时候,我们决定将主导航栏减少到4个项目,这样我们就可以在手机上展示完整的导航,而不是把它藏在抽屉里。”

为了减少移动端网站的长度,Bluegg使用了带有“峰值”的水平滚动模式来显示页面外的内容。这让团队有机会在不牺牲页面长度的情况下使用一些丰富的图片。

Magento to Shopify:迁移后的移动网站
Character.com迁移后的移动主页。

总的来说,Tom坚持认为他的团队面临的最大设计和UX挑战是确保客户的投资回报。因为网站已经运行得非常好了,他们需要确保一次重大的重新设计不会产生不利影响,即使最终看起来和功能都更好了。

“如果网站看起来‘过于高端’,给人一种错误的印象,我们很可能会失去流量。我们在设计过程中做了大量的用户测试,以确保我们达到了正确的平衡。”

你可能还会喜欢:用户研究方法:13个掌握过程的专家提示

史诗般的迁徙

导入现有的产品数据Character.com的Magento自定义设置是一项复杂的工作,很大程度上是因为Magento网站上有大量的自定义工作。Bluegg团队决定使用Magento和Shopify api编写一个自定义导入脚本。

该项目的网页开发人员马特解释说,Bluegg在本地运行Magento网站的一个版本。

这样,我们就不必在活动站点上启动一个长时间运行的数据库密集型进程。一旦我们有了这个,我们写了一个复杂的脚本,把现有的产品数据映射到Shopify在其CSV导入中需要的字段,”马特说。

使用这些导出的数据,经过一些尝试和错误,他们能够相对轻松地将产品转移到Shopify。

马特补充道:“这也意味着我们可以在新网站上线之前尽可能晚地获取最新版本的产品数据库,这意味着客户可以继续添加新产品,直到上线那天。”

Bluegg也使用这个过程进行导入Character.com将现有客户转移到Shopify,因为已经转移了产品数据,这一过程变得更容易。

关于从Magento到Shopify重新平台的建议

Magento to Shopify:致力于迁移的web开发人员
Bluegg的web开发人员Paul和Matt负责迁移部分Character.com项目。

将网站迁移到Shopify对Bluegg来说是一项高度定制的工作。考虑到这一点,负责监督迁移的Bluegg web开发人员Paul Goodfield给出了将商店从Magento迁移到Shopify的最佳建议:

  1. 让Magento安装在本地运行.这意味着在数据库上运行任何查询都不会降低生产服务器的速度。我们在不下载整个Magento安装的情况下完成了这一任务;我们只是需要应用程序自由而且var文件夹及其内容。
  2. 设置一个PHP脚本,将DB数据转换为Shopify期望的CSV格式.脚本应该为要进入的数据创建一个模型。我们使用了多维数组(数组的数组)。数组中的第一项将作为CSV的标题行,并包含列标题。
  3. 引导您的应用程序使用法师:应用()函数.这样你就能访问Magento的所有数据。您可以使用Magento命令从DB中提取数据。可以将额外的命令链接在一起,以检索特定的属性并筛选结果。然后可以将这些映射到数组中的相关字段。
  4. 将某些字段映射并格式化为自定义标记,以便在设置筛选和搜索功能时节省时间.这也使得建立智能集合变得更容易,因为当我们这样做的时候,产品已经被标记了。
  5. 填充数组并循环遍历它以生成最终的CSV.在PHP中设置正确的文件头意味着一旦脚本完成生成CSV,浏览器就会提示我们下载它。

总的来说,团队说迁移是一个陡峭的学习曲线,有一些尝试和错误。但在一天结束的时候,富有挑战性的新经历帮助他们在职业上成长。

Matt说道:“我认为我们学到的一件事便是,任何两个重新平台的项目都不可能完全相同。“学习一项新技术是困难的,所以最好的学习方法是全身心地投入进去,并相信你的专业知识会引导你完成它。”

我认为我们从中学到的一点是,任何两个重新平台的项目都不可能完全相同。”

移民带来回报

Magento to Shopify:改进的产品页面
之一Character.com改进后的新产品页面。

Character.com在2016年7月底发布了他们的网站。到10月中旬,他们的总体转换率提高了40%。

一个外观新颖、简化了用户旅程的网站,加上更好的网站导航和改进的产品发现,台式电脑的转化率提高了40%。在移动端,用户友好的移动体验,加上简化的结账,使移动端转化率提高了65%。

总的来说,汤姆说迁移到Shopify和更值得信赖的品牌和设计Character.com帮助提高转化率。

收入的大幅增长意味着Character.com可以升级到Shopify plus——这对Bluegg团队来说是一场伟大的胜利。

此外,该网站的跳出率下降了10%,平均订单价值增加了近17%,每次访问的页面增加了33%。

汤姆解释道:“我们让人们在网站上停留的时间更长一些,并引导他们更多地浏览产品。

整体增长都在上升,而Character.com2015年8月与2016年8月相比,其营收增长了300%。

“与2015年8月相比,2016年8月的收入增长了300%。”

汤姆表示:“这显然是一种自然增长,还有一些大的一次性销售。”“但这也反映了自发布以来的显著增长,这对我们的团队来说是一个惊人的成就。”

你可能还会喜欢:从Reddit到重新设计:燃料如何使一个商人的收入增加30%

新阶段,新教训

作为Character.com作为企业级商家进入了一个新的阶段,Bluegg团队继续作为设计合作伙伴,并继续迭代和改进网站。事实上,在迁移四年后,Bluegg再次与Character.com合作,推出了一个全新的重新设计的网站。

总而言之,为他们的第一个电子商务构建之一接受巨大的挑战不仅是Bluegg非常成功的努力,而且也促使团队相信他们在工作中学习的能力。

Tom说道:“作为一名有经验的开发者或设计师,被迫离开自己的舒适区是一件很艰难的事。“但你需要对自己解决问题的能力和边做边学的能力有信心。因为在你的舒适区之外工作只是工作的一部分。”

随着Character.com从Magento转向Shopify, Bluegg证明了走出舒适区是多么成功。

主题:

通过Shopify合作伙伴计划发展您的业务

了解更多