java rwd_面向任务的设计-不仅限于Mobile First和RWD

java rwd

We already know that majority of solutions should start with a design for smartphones, we know that all websites should be responsive. Now, it’s time to think about holistic solutions with specific tasks adapted to all kind of devices.

我们已经知道大多数解决方案都应该从智能手机的设计开始,我们知道所有网站都应该具有响应能力。 现在,是时候考虑针对特定任务适应各种设备的整体解决方案了。

许多设计师倾向于制作“数字口袋刀”。 (Lots of Designers tend to make “Digital Pocket Knives.”)

We like to make solutions universal, but every device category is different. Making design universal does not mean that it will work well in all cases.

我们希望使解决方案通用,但是每个设备类别都不相同。 使设计通用化并不意味着它在所有情况下都能正常工作。

We can compare this situation to stuff like pocket knives. They pack many multiple tools inside a small object. However, do you use your pocket knife all the time? What tool do you use when you have to slice bread or cut paper? Is it a pocket knife? The majority of us will answer no.

我们可以将这种情况与小刀之类的东西进行比较。 他们在一个小物体中包装了许多工具。 但是,您是否一直使用小刀? 当您要切面包或切纸时,您使用什么工具? 是小刀吗? 我们大多数人会回答“否”。

We love to use tools specialized for specific activity. It is the same when it comes to digital solutions.

我们喜欢使用专门用于特定活动的工具。 在数字解决方案方面也是如此。

Task-Oriented Design is about creating specialized Interfaces for each category of device. It also helps us to understand if it is worth doing.

面向任务的设计是为每种设备类别创建专门的接口。 它还可以帮助我们了解是否值得这样做。

什么是面向任务的设计? (What is the Task-Oriented Design?)

As we know, digital solutions — apps and websites are not used only on personal computers but on a wide variety of devices. What’s more, people use every device category in various situations and for different purposes.

众所周知,数字解决方案-应用程序和网站不仅在个人计算机上使用,而且在各种设备上使用。 此外,人们在各种情况下出于不同目的使用每种设备类别。

Some tasks are easier to be done on a smartphone, some on a smartwatch. Some activities are still the most comfortable to accomplish with large screens of traditional computers.

有些任务更容易在智能手机上完成,有些任务更容易在智能手表上完成。 在传统计算机的大屏幕上完成某些活动仍然是最舒适的。

We have to observe which activities will be appropriate for the specific device. What’s more, we have to figure out how to use unique characteristics of the hardware to make a solution as convenient as possible.

我们必须观察哪些活动适合特定设备。 此外,我们必须弄清楚如何使用硬件的独特特性来使解决方案尽可能方​​便。

The primary goal of Task-Oriented Design is to make the interaction with the solution seamless — this means that the task that was started on one device may be continued on the other immediately.

面向任务的设计的主要目标是使与解决方案的无缝交互 -这意味着在一个设备上启动的任务可以立即在另一设备上继续。

新的自适应网页设计? (New Responsive Web Design?)

Task-Oriented Design is not Responsive Web Design. It is much more. We may assume that RWD is the first step to enter into the subject of Task-Oriented Design. Adjusting the appearance is the must to make the solution usable on specific devices like smartphones.

面向任务的设计不是响应式Web设计。 不仅如此。 我们可以假设RWD是进入面向任务设计主题的第一步。 调整外观是使解决方案可在智能手机等特定设备上使用的必要条件。

Responsive Web Design assumes that there are a least three major device categories (desktops, tablets, and smartphones). Designers focus on preparing layouts with all elements in a way that will be readable to every category. Some designers found that specific content may be hidden or replaced with other content on smaller devices.

响应式Web设计假定至少存在三个主要设备类别(台式机,平板电脑和智能手机)。 设计师专注于以所有类别都可以读取的方式准备包含所有元素的布局。 一些设计人员发现,特定的内容可能在较小的设备上被隐藏或替换为其他内容。

TOD (Task-Oriented Design) goes further. Some processes should be shaped exclusively for each device category. Some of the tasks may not be available for some hardware(like wearables). Others require a completely different approach. Example: for Smart Speakers, we use VUI instead of GUI.

TOD(面向任务的设计)走得更远。 某些过程应专门针对每种设备类别而定。 有些任务可能不适用于某些硬件 (例如可穿戴设备)。 其他人则需要完全不同的方法。 示例:对于智能扬声器,我们使用VUI代替GUI。

Building a solution that makes an impression of the consistent product across platforms, but features are crafted for specific abilities of the device type, is the primary goal of Task-Oriented Design.

面向任务的设计的主要目标是构建一个解决方案,该解决方案可在各个平台上给人以一致的印象,但是功能是针对设备类型的特定功能而设计的。

Image for post
Three target devices for Responsive Web Design
响应式Web设计的三个目标设备

那移动优先呢? (What about Mobile First?)

The majority of solutions still should start with a design for a smartphone. Mobile is the perfect platform to start because, like standard computers, this category is used by the majority of people.

大多数解决方案仍应从智能手机的设计开始。 移动是启动的理想平台,因为与标准计算机一样,该类别被大多数人使用。

Mobile designs are obviously extended to work faster on tablets. Now, apps with UI from tablets may be launched on Personal Computers (See Apple’s iPad & macOS apps). Having a smartphone app is also a nice exercise to prepare features for the smartwatch that may be directly connected with the Mobile app.

显然,移动设计已扩展为可在平板电脑上更快地工作。 现在,具有平板电脑UI的应用程序可能会在个人计算机上启动(请参阅Apple的iPad和macOS应用程序)。 拥有智能手机应用程序也是为可与移动应用程序直接连接的智能手表准备功能的不错的练习。

There are also cases when it does not matter so much. If you design Voice Assistant, you do not need to focus on Graphical User Interface so much — even for Mobile.

在某些情况下,它并不重要。 如果您设计语音助手,则无需过多地关注图形用户界面,即使对于移动设备也是如此。

Image for post
Smart Devices around us
我们身边的智能设备

面向任务的设计是否反映了现实生活? (Does Task-Oriented Design reflect real life?)

This is why it has been forged. As I mentioned in the first sentence, we do not use pocket knives all the time — and we do not use only laptops or desktops. Technology has specialized in various forms that may be shaped to deliver a genuinely delightful experience.

这就是为什么它是伪造的。 正如我在第一句话中提到的那样,我们不会一直使用小刀-而且我们不会仅使用笔记本电脑或台式机。 技术以各种形式专门化,可以提供真正令人愉悦的体验。

Look at your typical day…

看你平常的日子...

I am sure that Smartphone or Smartwatch alarm wake you up. Then morning run or exercises monitored by your wearable are also the perfect occasions to listen to some podcasts with Smartwatch connected with wireless Headphones. Next, you read some news from your Tablet during breakfast. When you drive to work, Smartphone connected with Car through CarPlay or Android Auto continue playing your previously listened podcast.

我确定智能手机Smartwatch闹钟会唤醒您。 然后,通过可穿戴设备监控的晨跑或锻炼,也是通过Smartwatch和无线耳机连接收听某些播客的绝佳场合。 接下来,您在早餐期间从平板电脑上读取了一些新闻。 当您开车上班时,通过CarPlay或Android Auto与Car连接的Smartphone会继续播放以前收听的播客。

Your job requires you to have a Laptop that is a workstation for the most specialized parts of your work. During the meetings, you make notes with Stylus on your Tablet. Notes made on sticky notes are also photographed with your Smartphone’s camera and sent automatically to your Laptop.

您的工作需要您拥有一台笔记本电脑 ,该笔记本电脑是您工作中最专业的部分的工作站。 在会议期间,您可以在Tablet上使用手写笔做笔记。 便签上的笔记也会用智能手机的相机拍摄,并自动发送到笔记本电脑

Driving back home is an excellent time to finish the podcast episode. You also make some grocery shopping with the list prepared earlier on your Tablet or Laptop. To mark items as purchased, you use a Smartphone or Wearable device.

开车回家是完成播客节目的绝佳时机。 您还可以使用先前在平板电脑笔记本电脑上准备的清单进行杂货店购物。 要将商品标记为已购买,请使用智能手机可穿戴设备。

While cooking, Assistant from the Smart speaker guides you to prepare a meal or reminds important things. After dinner, it is time to relax. You launch Smart TV with your Smartphone and play an episode of your favorite movie.

烹饪时, 智能扬声器的助手会指导您准备餐点或提醒重要的事情。 晚餐后,该放松一下。 您可以使用智能手机启动智能电视 ,并播放自己喜欢的电影的一集。

At the end of the day, you check your tasks for the next day with a Smartphone and make sure that the alarm was set.

一天结束时,您可以使用智能手机检查第二天的任务,并确保已设置警报。

Look at that variety of devices and multiple tasks performed on each of them. Even if you do not use some of the mentioned devices, you see that the majority of the mentioned cases fit perfectly.

查看各种设备以及在每个设备上执行的多项任务。 即使您不使用某些提到的设备,您也会看到大多数提到的情况都非常合适。

Task-Oriented Design is the strategic thinking of how we use technology today. Every category of device is more comfortable with different types of interactions and solutions.

面向任务的设计是当今我们如何使用技术的战略思考。 每种类型的设备都更适合不同类型的交互和解决方案。

特定设备中使用哪些任务 (What tasks are used in specific devices)

Let’s try to briefly highlight categories where specific device category is most useful.

让我们尝试简要地突出显示其中特定设备类别最有用的类别。

🖥 Desktop — These classic devices have got the widest purpose. They are used for all kinds of things. However, you will not use it for daily activity monitoring and navigation (GPS).

🖥台式机 -这些经典设备用途最广。 它们用于各种事物。 但是,您不会将其用于日常活动监视和导航(GPS)。

💻 Tablet — The next device category able to helps us with a wide variety of things. Tablets may successfully replace computers in most cases. They are especially useful when you want to browse the internet, communicate, get news, listen to music and podcasts, draw, control smart home, watch movies, play games, read books, take photos, etc. Lots of activities from the ones related to work into entertainment!

💻 平板电脑 —下一个可以帮助我们处理各种事情的设备类别。 在大多数情况下,平板电脑可以成功取代计算机。 当您想浏览互联网,交流,获取新闻,听音乐和播客,绘画,控制智能家居,看电影,玩游戏,读书,拍照等时,它们特别有用。与之相关的许多活动工作娱乐!

📱Smartphone — These are very personal devices and are useful for a very wide variety of things. Their main limits are quite small screen sizes. With a Smartphone, you can do almost the same stuff as in Tablets plus some daily activity monitoring and navigation.

📱 智能手机 —这些是非常个人化的设备,可用于各种各样的事情。 它们的主要限制是相当小的屏幕尺寸。 使用智能手机,您可以执行与平板电脑几乎相同的工作,并且可以进行一些日常活动监视和导航。

⌚️ Smartwatch — Wearables are the most personal device of all, good to track various activities, receive notifications, but poor usability when it comes to creating things or editing existing ones.With Smartwatch, you can easily track daily activity, monitor health, communicate, and receive notifications. You may also navigate and listen to music.

Smart️Smartwatch —可穿戴设备是所有设备中最个人的设备,可以很好地跟踪各种活动,接收通知,但是在创建事物或编辑现有事物时可用性很差。借助Smartwatch,您可以轻松地跟踪日常活动,监控健康状况,进行交流,并接收通知。 您也可以导航和听音乐。

📺 Smart TV — TVs were always good for entertainment, and even when they became “Smart,” their usage category did not change much. Smart TVs are commonly used to watch movies (obvious!), browse the internet, play games, or control a smart home.

📺智能电视 -电视始终很适合娱乐,即使它们变得“智能”,其使用类别也没有太大变化。 智能电视通常用于观看电影(很明显!),浏览互联网,玩游戏或控制智能家居。

🔈 Smart Speaker — This is a quite new and not so popular category of the devices. Their power is in voice assistants. No Graphical User Interfaces limits their capabilities. They are good when you want to listen to music, get news or information, or even control your smart home.

Speaker Smart Speaker ( 智能扬声器) —这是设备中的一个相当新的但不太流行的类别。 他们的力量在于语音助手。 没有图形用户界面会限制其功能。 当您想听音乐,获取新闻或信息,甚至控制您的智能家居时,它们非常有用。

🚗 Car — Driving a car requires a top level of focus. That’s Smart Car System that cannot grab our full attention. In the car, you can comfortably navigate, listen to music or podcasts, and use voice communication.

🚗汽车 -驾驶汽车需要高度关注。 那是无法吸引我们全部注意力的智能汽车系统。 在汽车中,您可以舒适地导航,听音乐或播客以及使用语音通信。

Image for post
Multiple tasks, multiple devices, but some areas are the same.
多个任务,多个设备,但某些区域相同。

面向任务的设计有助于说不 (Task-Oriented Design Helps to Say No)

Some solutions should not appear on specific devices. Thinking about a specific device category is also about knowing their limitations.

一些解决方案不应出现在特定设备上。 考虑特定的设备类别也要了解它们的局限性。

Examples: writing notes will never be convenient on a smartwatch, you will not draw with your virtual assistant through the speaker and play a game while driving the car (yes, it should be possible when the car is parked ;) ).

示例:在智能手表上书写笔记永远不会方便,您将不会通过虚拟助手在扬声器上画画,也不会在开车时玩游戏(是的,当汽车停放时应该有可能;))。

Apple Calendar-面向任务的设计示例 (Apple Calendar — Sample of Task-Oriented Design)

Lots of existing solutions take advantage of a variety of device types. Companies like Google, Apple, and Microsoft already know that this approach is the best what they can offer to the user. Let’s see the simple example of Apple’s Calendar.

许多现有解决方案都利用了多种设备类型。 像Google,Apple和Microsoft这样的公司已经知道这种方法是他们可以为用户提供的最好的方法。 让我们看一下Apple日历的简单示例。

The giant from Cupertino is excellent with Task-Oriented Design. Having a wide range of devices and control over hardware and software results in pretty good solutions! Let’s try to focus on Calendar, which is the app used by the majority of users.

库比蒂诺(Cupertino)的巨头在面向任务设计方面表现出色。 拥有广泛的设备以及对硬件和软件的控制,可以带来非常好的解决方案! 让我们尝试着眼于日历,这是大多数用户使用的应用程序。

You may use the calendar app on your iPhone, Mac, or iPad, that’s obvious. These three devices offer all needed features from reminding us about the event through the ability to create or edit it.

很明显,您可以在iPhone,Mac或iPad上使用日历应用程序。 从提醒我们有关事件的能力到创建或编辑事件的能力,这三种设备均提供了所有必需的功能。

With Apple Watch, you also got the Calendar app inside. Your watch face with complication (little widget) may display the upcoming event, or you may browse a few upcoming ones in the app. If you set a reminder to your event, you will also receive the notification on your Smartwatch.

借助Apple Watch,您还可以在其中使用“日历”应用程序。 复杂的表盘(小部件)可能显示即将发生的事件,或者您可以在应用程序中浏览一些即将发生的事件。 如果您为活动设置提醒,您还将在Smartwatch上收到通知。

What’s more, CarPlay also includes a Calendar App. This means that your car will remind you about the event, or you are able to browse the list or upcoming ones.

此外,CarPlay还包含一个日历应用程序。 这意味着您的汽车会提醒您有关事件的信息,或者您可以浏览列表或即将到来的事件。

Finally, HomePod with Siri is able to notify you and add or modify events through short voice commands.

最后,带有Siri的HomePod能够通过简短的语音命令通知您并添加或修改事件。

Image for post
Apple Calendar on multiple devices. Task-Oriented Design in action.
在多个设备上的Apple Calendar。 面向任务的设计付诸实践。

如何在任务驱动设计中保持一致性。 (How to maintain consistency in Task Driven Design.)

Making a solution that feels familiar on so many different devices is very challenging. To maintain consistency, previously mentioned Apple had developed a Design System that gives the user experience of seamless experience connected with Brand.

在许多不同的设备上打造让人感到熟悉的解决方案非常具有挑战性。 为了保持一致性,前面提到的Apple开发了一个设计系统 ,该系统可为用户提供与Brand相关的无缝体验。

For all Graphical User Interfaces, designers used the same font family and color tones. Iconography is also identical. For Voice Assistant, Apple used well know Siri voice with commands that are identical across macOS, iOS, Apple Watch, or HomePod.

对于所有图形用户界面,设计人员使用相同的字体系列和色调。 图像学也相同。 对于Voice Assistant,Apple使用众所周知的Siri语音,其命令在macOS,iOS,Apple Watch或HomePod上均相同。

Creating a scalable and modular design system is a must for Task-Oriented Design System. To achieve this, you have to know how to manage the multiple libraries.

对于面向任务的设计系统,必须创建可扩展的模块化设计系统。 为此,您必须知道如何管理多个库

在哪里了解更多? (Where to learn more?)

Here are some inspiration stories and guidelines from companies that already think about every device category as a part of wider system:

以下是一些公司的灵感故事和指南,这些公司已经考虑将每个设备类别作为更广泛的系统的一部分:

加起来 (Summing up)

Now you already know that Task-Oriented Design is a natural trend that already exists and becomes more popular in recent years. I described this type of thinking in my blog article — this story is its extension. I hope it will help you to design more consciously.

现在您已经知道,面向任务的设计是一种自然趋势,已经存在并且近年来越来越流行。 我在博客文章中描述了这种思维方式-这个故事是它的延伸。 希望它能帮助您更自觉地进行设计。

When you create a solution for multiple devices, it is crucial to know the specific device’s abilities and limitations. This will let you design the best user experience.

为多个设备创建解决方案时,了解特定设备的功能和局限性至关重要。 这将使您设计出最佳的用户体验。

What do you think of Task-Oriented Design? Do you use this type of thinking in your projects? Let me know in the comments!

您如何看待面向任务的设计? 您在项目中使用这种思维方式吗? 在评论中让我知道!

Thank you for reading!

感谢您的阅读!

翻译自: https://blog.prototypr.io/task-oriented-design-more-than-mobile-first-and-rwd-712bd5e4ca52

java rwd

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值