aws 首尔

by Martin Totev

马丁·托特夫(Martin Totev)

首尔自行车：我如何重新设计首尔市的公共自行车系统 (Seoul Bike: How I redesigned Seoul City’s public bicycle system)

对当前应用程序的沮丧促使我创建了我的第一个UX案例研究。 (Frustration with the current app drove me to create my first UX case study.)

As a beginner in UX design, a great way to learn something new is through practice. This case study was an amazing opportunity to start my journey. With this as my objective, I contacted a senior from my university with a lot of work experience in the field and asked for his assistance and mentoring.

作为UX设计的初学者，学习实践的好方法是练习。 这个案例研究是开始我的旅程的绝佳机会。 以此为目标，我联系了我所在大学的一位在该领域具有丰富工作经验的高级管理人员，并要求他的帮助和指导。

We met on a Sunday in a coffee-shop somewhere in Seoul and started working. I brought my old Samsung laptop (eventually replaced with a Macbook) and a small notebook to our first meet-up.

我们星期天在首尔某处的咖啡店见面，开始工作。 我将旧的三星笔记本电脑(最终被Macbook替换)和一本小笔记本电脑带到了我们的第一次聚会中。

For a few weeks I sketched and sketched, trying to understand the app and how the service was designed. I found problems that stem from the service itself, others from the app design. But let’s not steer away from the point of this post.

在几周的时间里，我进行了草图绘制，试图了解应用程序以及服务的设计方式。 我发现问题来自服务本身，其他原因来自应用程序设计。 但是，我们不要偏离本文的重点。

什么是“首尔自行车”？ (What is “Seoul Bike”?)

Seoul Bike or 따릉이 Ttareungi) is an un-manned, bicycle rental system. As the title says in Korean — 서울자전거 따릉이 — 무인대여시스템, it’s a very cheap public bicycles system covering Seoul. The coverage of the system and the ability to return a bicycle at a different location than the one you rent it from, is its biggest advantage over the competition. Seoul Bike is currently experiencing a very fast growing user base.

Seoul Bike或따릉이Ttareungi)是一种无人自行车租赁系统。 顾名思义，韩文是서울자전거따릉이-무인대여시스템，它是覆盖首尔的非常便宜的公共自行车系统。 该系统的覆盖范围以及将自行车归还与您所租用的位置不同的能力，是它在竞争中的最大优势。 首尔自行车目前正经历着非常快速增长的用户群。

There are 3 generations of bicycles that look very similar and are very hard to distinguish. They are usually donated by a large corporation, but information on who and how many donated, has not been updated for quite some time. Samsung donated 3,000 bicycles and installed 300 racks last year. Some of the bicycles are donated by Naver, Kakao, Woori Bank, and even the embassy of the Netherlands.

共有3代自行车，它们看起来非常相似，而且很难区分。 它们通常是由大公司捐赠的，但是有关捐赠者和捐赠数量的信息已有相当长的一段时间没有更新。 三星去年捐赠了3000辆自行车，并安装了300个机架。 其中一些自行车是由Naver，Kakao，Woori Bank甚至荷兰大使馆捐赠的。

The bicycle is fairly simple. It has 3 gears and a retracting seat specially made to only fit these bicycles — bicycle seat theft is still a thing for some reason. There is a touch screen user interface with a single button and a speaker. There’s also a locking mechanism for locking the bike to a Seoul Bike rack, or temporarily locking it to a pole when you have to leave it for a while. In the middle of a ride you can check how much time you have used the bike for, what distance you have travelled, and how many calories you have burned.

自行车很简单。 它具有3个齿轮和一个专门为只能容纳这些自行车而设计的缩回座椅-出于某种原因，盗窃自行车座椅仍然是一件大事。 有一个带有单个按钮和一个扬声器的触摸屏用户界面。 还有一种锁定机制，可将自行车锁定到首尔自行车架上，或者在您需要离开一会儿时将其临时锁定到杆上。 在骑车过程中，您可以检查自行车使用了多少时间，行驶了多长时间以及燃烧了多少卡路里。

The service utilises multi-use “tickets” which expire after a certain amount of time. These “tickets” are divided into Short term and Long term ones. A short term ticket is a single day ticket that costs 1,000 won and expires in 24 hours after purchase. The long term tickets include 7 days (3,000 won), 30 days (5,000 won), 180 days (15,000 won) and a 365 days (30,000 won).

该服务利用了多次使用的“ 票证” ，这些票证会在一定时间后失效。 这些“ 票证”分为短期票证和长期票证 。 短期票是单日票，价格为1,000韩元，有效期为购买后的24小时。 长期票包括7天(3,000韩元) ， 30天(5,000韩元) ， 180天(15,000韩元)和365天(30,000韩元) 。

To prevent bicycle hoarding the default amount of time that a user is allowed to rent for is 1 hour (normal ticket) or 2 hours (premium ticket). If you go over 1 hour (or 2 hours if premium ticket) there is a penalty of 1,000 won for every hour. And upon return of the bike the user must pay his penalty first before renting again. This hoarding prevention scheme is quite effective.

为防止自行车ard积，允许用户租用的默认时间为1小时(普通票)或2小时(高级票)。 如果您超过1小时(如果是高级票则超过2小时)，则每小时需支付1,000韩元的罚款。 并且，在归还自行车时，用户必须先支付罚款，然后才能再次租用。 这种ho积防止方案非常有效。

As I mentioned, a ticket is multi-use — so a user could always return a bike to a rack and rent it again. Thus bike hoarding is still possible, as long there is a rack nearby and you are in the mood of going up and down.

正如我所提到的，门票是多用途的，因此用户始终可以将自行车退回机架并再次租用。 因此，只要附近有一个架子，并且您有上下的心情，仍然可以进行自行车ho积。

The renting process is only done through a mobile app that until recently was Android only. And here comes a handful of problems — the app is over- complicated, and the whole user-flow is off, riddled with misplaced assets. For instance, why is there a back button on the main screen? Go back to where? And why does the app have missing essential notifications and information?

租用过程只能通过直到最近才仅限于Android的移动应用程序来完成。 随之而来的是一些问题-应用程序过于复杂，整个用户流都中断了，到处都是放错地方的资产。 例如，为什么在主屏幕上有一个后退按钮？ 回到哪里？ 为什么该应用程序缺少必要的通知和信息？

Let’s start with the main page. The page that welcomes you when you first start the app is pretty basic. You have a Login button, a Station button which takes you to the map that marks the locations of the racks and how many bikes are available. Renting isn’t possible from this page. Then there’s a Ticket Purchase button and a My Page button which contains information about your rides. There’s also a Call Centre button for when you need to ask for help.

让我们从主页开始。 初次启动应用程序时欢迎您的页面非常基本。 您有一个Login按钮 ，一个Station按钮 ，可以带您到地图上，该地图上标出了机架的位置以及可用的自行车数量。 无法从此页面租房。 然后是“ 购票”按钮和“ 我的页面”按钮 ，其中包含有关游乐设施的信息。 当您需要帮助时，还有一个“ 呼叫中心”按钮 。

One thing that you might have noticed is the back button on the top left of the screen. A button that leads you nowhere. And a hamburger menu button on the right that forces the menu to pop out from the left of the screen. Why?

您可能已经注意到的一件事是屏幕左上方的“ 后退”按钮 。 一个无法指引您的按钮。 右侧的汉堡菜单按钮会强制菜单从屏幕左侧弹出。 为什么？

登录 (Login)

The current design requires a user to log in and proceed with the service. It has the option of remembering your username and password. But upon closing the app the user is logged out, creating this mandatory Login Page tap — that could be bothersome, especially if you are in a hurry. The Login screen should be a one time experience for a mobile app. After all a mobile phone is a personal device that is rarely left unattended.

当前的设计要求用户登录并继续使用该服务。 它可以选择记住您的用户名和密码。 但是，在关闭应用程序后，用户将注销，创建此强制性的“ 登录页面”水龙头-这可能很麻烦，尤其是在您急忙时。 对于移动应用程序，登录屏幕应该是一次体验。 毕竟，手机是很少有人看管的个人设备。

The app itself does not store credit card information and other sensitive data that must be protected with a mandatory automatic log out. With the redesigned experience, such sensitive data will be protected with a password prompt. This will add an extra layer of protection from undesired 3rd parties.

该应用程序本身不存储信用卡信息和其他敏感数据，这些数据必须通过强制性自动注销来加以保护。 经过重新设计的体验，此类敏感数据将通过密码提示进行保护。 这将为不需要的第三方增加额外的保护层。

主要 (Main)

Seoul Bike is a service that offers rentals of transportation vehicles. Hence, the first thing a user should see is a map with locations around him from where he could rent. With a single glance of the screen, the user should see the currently selected rack and the other racks in the vicinity. The available and unavailable ones should be easily distinguishable. Car rental apps like Socar and Green Car show the user a map with locations near you.

Seoul Bike是一项提供运输车辆租赁服务。 因此，用户应该首先看到的是一张地图，上面有他可以租用的位置。 只需看一下屏幕，用户就可以看到当前选择的机架以及附近的其他机架。 可用的和不可用的应该易于区分。 Socar和Green Car等汽车租赁应用程序会向用户显示附近的位置的地图。

A major problem I noticed when using the service for a whole year is that a number of users tend to rent a bicycle that is too far away from them. This prevents people at the rack from using the service. Currently if you rent a bicycle and not unlock it from the rack within 5 minutes, the rent is automatically cancelled. For a casual leisure ride, waiting for 5 minutes is not that big of a problem ( nobody likes waiting in the current fast paced lifestyle). But for someone that starts his or her morning commute to work, waiting for 5 minutes is not an option.

我整年使用这项服务时注意到的一个主要问题是，许多用户倾向于租一辆离他们太远的自行车。 这样可以防止机架上的人使用该服务。 目前，如果您租借自行车而未在5分钟内将其从机架上解锁，则租借将自动取消。 对于休闲休闲而言，等待5分钟并不是什么大问题(没有人喜欢在当今快节奏的生活方式中等待)。 但是对于开始上下班的人来说，等待5分钟是不可行的。

To prevent such occurrences, I designed the service to make use of the mobile devices location tracking. This will see if the user is within 100 meters of the rack he intends to rent from. A normal GPS in a modern mobile device has accuracy of around 50 meters — and 100 meters is, in my opinion, a safer distance for a GPS. A distance of 100 meters means the user could see the rack if nothing is in the way, and need just few seconds to approach it.

为了防止发生此类情况，我设计了该服务以利用移动设备的位置跟踪。 这将查看用户是否在要从其出租的机架的100米范围内。 现代移动设备中的普通GPS的精度约为50米，而我认为100米是GPS的安全距离。 100米的距离意味着如果没有任何障碍物，用户可以看到机架，并且只需几秒钟即可接近机架。

The GPS data could be used to improve the service by analysing how users move with the bikes, when are the peak hours and which areas need to be managed at what times. Currently there is no such data and it is not analysed, and some areas where the bicycles are part of the morning commute are not managed properly.

GPS数据可用于通过分析用户如何骑自行车，高峰时段何时以及何时需要管理哪些区域来改善服务。 当前，尚无此类数据，也没有进行分析，并且自行车在早上上下班途中的某些区域没有得到适当的管理。

This data could be a great source of information for the city government itself. It could prove to be essential for an ever growing city with overpopulation and traffic problems. An affordable and reliable network of bicycles could ease the other means of public transportation, something that Seoul City needs to concentrate on.

这些数据可能是市政府本身的重要信息来源。 对于一个人口众多和交通问题不断发展的城市，它可能被证明是必不可少的。 负担得起且可靠的自行车网络可以减轻其他公共交通方式的负担，这是首尔市需要集中精力的事情。

There are manual options currently used in the app, such as manual search and QR code scan. They are quite useful in the event of GPS error or if the location of the user is unavailable. The user could always search for a rack by it’s unique number or name, or scan a QR code attached to the rack to use the service. These modes are switched with just a single tap from the top bar. Search screen also contains your favourite locations personalised by the user.

该应用程序当前使用一些手动选项，例如手动搜索和QR码扫描。 在GPS错误或用户位置不可用的情况下，它们非常有用。 用户可以始终通过机架的唯一编号或名称来搜索机架，或者扫描机架上附带的QR码以使用该服务。 只需单击顶部栏中的，即可切换这些模式。 搜索屏幕还包含由用户个性化的您喜欢的位置。

通知事项 (Notifications)

Usually when I am in a hurry, I get a very unwanted surprise every now and then. A message “You do not have a ticket, purchase one first and try again” comes out of the speaker attached on the bike. Sometimes when I need a bicycle the most, there is none at rack near my house. Not a surprise I enjoy, but a surprise nonetheless.

通常，当我着急时，我会时不时地得到意外的惊喜。 自行车上附带的扬声器发出“您没有门票，先购买一张，然后再试一次”的消息。 有时，当我最需要自行车时，我家附近没有架子。 我并不感到惊讶，但仍然感到惊讶。

To prevent such incidents, some essential information should be displayed through non-intrusive push notifications. For instance — the current number of bicycles at a favourite rack, the time remaining of your current ride, and an imminent expiration of a ticket. The user is required to select a certain time frame for the features to work. This is needed to reduce the load on the servers from the constant update requests and mobile data usage.

为了防止此类事件，应通过非侵入式推送通知显示一些基本信息。 例如，当前在最喜欢的机架上的自行车数量，当前骑行剩余的时间以及门票即将到期。 用户需要选择某个时间范围才能使用这些功能。 需要这样做，以减少来自不断更新请求和移动数据使用的服务器负载。

Let’s imagine a person called Zoe. Zoe lives in an area where there is no direct bus to the subway station where she goes daily. The walking distance is around 14 minutes, but with a Seoul Bike she can go there in 5. With the increased popularity of the bikes she is often forced to walk in a hurry, because there are no bikes on the rack.

让我们想象一个叫佐伊的人。 佐伊(Zoe)居住在每天都不去地铁站的直达巴士区域。 步行距离约为14分钟，但是有了首尔自行车，她可以在5分钟内到达那里。随着自行车的普及，由于机架上没有自行车，她常常被迫匆忙走路。

With this feature, she adds the nearest bicycle rack to her favourites. Next, from the app settings she turns on notifications for the rack status. From 08:00 to 08:20 she gets updates on how many bikes are available there. This will help her plan in advance if she needs walk to the subway station and leave a bit early.

通过此功能，她将最近的自行车架添加到收藏夹中。 接下来，从应用程序设置中，她打开有关机架状态的 通知 。 从08:00到08:20，她会收到有关那里有多少辆自行车的最新信息。 如果她需要步行到地铁站并提早离开，这将有助于她提前计划。

汉堡菜单 (Hamburger Menu)

The “hamburger” menu is like the map of the app, it takes a person from point A to point B with ease. By grouping features the user can easily remember their locations on the screen. As the central crossroad of the app, it can be used to inform the user with essential information.

“汉堡包”菜单就像该应用程序的地图一样，它使一个人从A点轻松到达B点。 通过对功能进行分组，用户可以轻松记住他们在屏幕上的位置。 作为应用程序的中心十字路口，它可以用来向用户提供基本信息。

One of the most uncomfortable aspects of the current app is the difficulty of finding how much time is left on your current ticket. This is something that should be displayed in a proxy location, that takes a user from point A to point B of the app. In my design this location is the “Hamburger” menu to the side. It includes a real time information on the status of the current ticket, and does not require the user to enter a special page to view it.

当前应用程序最不舒服的方面之一是很难找到当前票证还剩多少时间。 这是应该显示在代理位置的内容，它将用户从应用程序的A点移到B点。 在我的设计中，该位置是侧面的“汉堡”菜单。 它包括有关当前故障单状态的实时信息，并且不需要用户输入特殊页面来查看它。

付款 (Payment)

Another frustrating aspect of the app is the ticket payment stage. Korea, and especially government operated online services, are obsessed with security. Most of them use a process of payment that is rage-infusing. There’s Active X, mobile phone authentication (sometimes several times) and a ton of other steps, just to spend 5,000 won on something.

该应用程序的另一个令人沮丧的方面是门票支付阶段。 韩国，尤其是政府运营的在线服务，对安全性着迷。 他们中的大多数人都使用激怒的付款方式。 有Active X，手机认证(有时是几次)和大量其他步骤，仅花费5,000韩元就可以了。

I can’t count the times I gave up buying something online because the payment stage left me speechless. A payment process should be secure yet quick, thus the “Ticket Purchase” pages required a new model. Kakao Pay or Naver Pay are brilliant payment services made to be easy and fast, and this app is in need of such.

我无法计算我放弃在线购买商品的次数，因为付款阶段使我无语。 付款过程应该安全且快速，因此“购票”页面需要新的模型。 Kakao Pay或Naver Pay是出色而便捷的付款服务，而此应用需要此服务。

With the collaboration of Kakao Pay or Naver Pay the whole payment process could be significantly simplified. It would become a more enjoyable experience, instead of an intimidating one that drives users away from the service, and which sometimes does not allow foreigners to pay at all. It did get better to be honest, but there are still limitations.

通过Kakao Pay或Naver Pay的合作，可以大大简化整个付款流程。 这将成为一种更令人愉悦的体验，而不是使用户远离该服务的吓人体验，并且有时甚至根本不允许外国人付费。 老实说，它确实变得更好，但是仍然存在局限性。

问题报告 (Problem Report)

Maintaining a growing garage of bicycles would require a very large workforce that could be out of budget for a local government. Instead of a large workforce, problematic bicycles could be engaged through user reports.

维持不断增长的自行车车库将需要大量劳动力，而这可能超出地方政府的预算。 可以通过用户报告来代替有问题的自行车来代替大量的劳动力。

Currently the app has only a call-centre where you could ask for help or report a problem with your bike or any other bike. Because of the scale of the service and how it’s built, there is no way to track when the bicycle broke down. If a bicycle breaks down while I was using it, I could just return it to a rack and leave it broken. The next user could report it but there is no benefit of going through the trouble of reporting it. Designing a reward based system is what Seoul Bike needs.

目前，该应用程序只有一个呼叫中心，您可以在其中寻求帮助或报告自行车或任何其他自行车的问题。 由于服务的规模及其构建方式，因此无法跟踪自行车何时发生故障。 如果在我使用自行车时自行车发生故障，我可以将其放回架子上并弄坏。 下一个用户可以报告它，但是麻烦去报告它没有任何好处。 设计基于奖励的系统是Seoul Bike所需要的。

Unfortunately, I couldn’t find any usage statistics. But the service has an ever-growing user base, and I have noticed a lot more problematic bicycles on my daily commutes.

不幸的是，我找不到任何使用情况统计信息。 但是该服务的用户群在不断增长，而且我在日常上下班途中发现了更多有问题的自行车。

Categorisation of the most frequent problems simplifies the page. Not only is it easy for the end user, it is also easier to log and for the engineers to prioritise tasks. Under every major category there are more detailed options just a tap away, such as punctured tire, bent wheel or spikes and so on. If the problem is not part of these categories or if there is something extra that you want to explain to the engineers, there is a message option under the “Other” tab.

最常见问题的分类简化了页面。 最终用户不仅容易，而且登录和工程师确定任务的优先级也更加容易。 在每个主要类别下，您都可以轻松找到更详细的选择，例如轮胎刺破，车轮弯曲或长钉等等。 如果问题不属于这些类别，或者您想向工程师解释一些其他问题，则在“其他”选项卡下有一个消息选项。

PS为什么从绿色变成蓝色和红色？ (P.S. Why from Green to Blue and Red?)

Seoul City had a very controversial re-branding last year. But there is a lack of unification between the services that the city government provides and the branding. I get it why the current colour on the app and the logo is Green — bicycle = Eco-friendly, Eco-friendly = Green. I believe that we should stop the over-use of the green colour when something is branded as eco-friendly.

去年，首尔市进行了非常有争议的品牌重塑 。 但是，市政府提供的服务与品牌之间缺乏统一。 我明白了为什么应用程序和徽标上的当前颜色是绿色-自行车=环保，绿色=绿色。 我认为，当某些产品被标记为环保产品时，我们应该停止过度使用绿色。

Seoul invested a lot of money in re-branding itself, and there needs to be consistency in the branding of their services. So I chose to use a derivation of the two colours used in “I •SEOUL • U”. Slightly tweaked blue and red from the city brand creates a nice contrast — with white and black and almost all shades of grey. Thus it becomes easier to create a hierarchy with the colours, even for colour blind people.

首尔在重新品牌本身上投入了大量资金，因此他们的服务品牌必须保持一致。 因此，我选择使用“ I • SEOUL • U”中使用的两种颜色的派生。 略微调整城市品牌的蓝色和红色可形成很好的对比-白色和黑色以及几乎所有的灰色阴影。 因此，即使对于色盲的人，使用颜色创建层次结构也变得更加容易。

Usability was my main focus, and these two colours were the best fit for this design while still maintaining consistency with the Seoul brand.

可用性是我的主要重点，这两种颜色最适合此设计，同时仍与首尔品牌保持一致。

免费的UI工具包 (Free UI Kit)

After working on this project in my spare time I got inspired by two people to release the file as a UI kit. Other people now can use the assets for their own designs. One of the people I was inspired by is a university friend of mine, who worked for 2 years on creating a Korean font (Busan Bada/부산바다체) and released it for free.

在业余时间从事此项目后，我受到两个人的启发，将其作为UI套件发布。 现在，其他人可以将资产用于自己的设计。 我的一个受启发的人是我的一个大学朋友，他从事了两年的韩文字体创建工作，并免费发布了该字体。

Another inspiration was the creator of Open Color and her interview on the Design Table podcast (lang: Korean). Her views on Open Source projects were really inspirational.

另一个灵感来自开放色彩的创造者以及她在Design Table播客上的采访(语言：韩语)。 她对开源项目的看法确实鼓舞人心。

Moreover, a few weeks ago the team at Bohemian Coding released Sketch v47 and the Libraries function — which takes symbols to a whole new level. So by sharing my Sketch file with the world, I hope I can help someone with some of the assets I made.

此外，几周前，波西米亚编码的团队发布了Sketch v47和库功能-将符号提升到一个全新的水平。 因此，通过与世界共享我的Sketch文件，希望我可以为某人提供我所拥有的一些资产。

This project was designed for an Android device, thus all the assets are inspired by Google’s Material Design. But in the future, I plan to update the file with an iOS cantered design (can’t promise that it will be done!). The symbols and buttons I put together are free to use. So feel free to include them in your Sketch Libraries!

该项目是为Android设备设计的，因此所有资产均受Google的Material Design启发。 但是将来，我计划使用iOS临时设计来更新文件(不能保证会完成！)。 我放在一起的符号和按钮可以免费使用。 因此，随时将它们包括在您的草图库中！

在此处下载免费的UI套件。 (Download the free UI Kit here.)

For previews of some of the symbols in the file click here.

有关文件中某些符号的预览，请单击此处 。

This UI Kit is free for personal and commercial use. If you use this kit as part of your work, mentioning it is greatly appreciated.

此UI Kit是免费的，可用于个人和商业用途。 如果您将此套件用作工作的一部分，则不胜感激。

The UI design itself is copyrighted, so please do not upload it on Dribble or Behance and claim it as your own. That would be really uncool. Like reeeaaaaally uncool…

UI设计本身已受版权保护，因此请勿将其上传到Dribble或Behance上并声明为您自己的。 那真是太酷了。 像里阿阿阿里不爽…

欢呼，继续创造！ (Cheers and keep on creating!)

You can find me at martintotev.github.io, follow me on twitter @martintotevUX or shoot me an email at martintotev89@gmail.com

您可以在martintotev.github.io上找到我，在Twitter @martintotevUX上关注我，或通过martintotev89@gmail.com向我发送电子邮件。

Special thanks to Sang Hyeon Park for becoming my mentor and guiding me into UX Design.

特别感谢Sang Hyeon Park成为我的导师并指导我进入UX Design。

翻译自: https://www.freecodecamp.org/news/seoul-bike-case-study-6ac4172f7188/

aws 首尔