这是用户在 2024-8-29 16:29 为 https://dribbble.com/stories/2024/08/21/putting-design-at-the-heart-of-technology?utm_campaign=20240... 保存的双语快照页面,由 沉浸式翻译 提供双语支持。了解如何保存?

close
Shot by

Putting design at the heart of technology

Thanks to our friends at Spaceship for sponsoring this blog post!
感谢我们在 Spaceship 的朋友赞助这篇博文!

Putting design at the heart of technology
将设计置于技术的核心

What’s the difference between a great machine and a great product? Design. Not just in terms of practical function, but in terms of overall branding design. Treating your brand design as an afterthought means you’re not truly putting the customer first. In fact, branding, design, and technology should all be treated as one to bring the ultimate user experience and consistency.
出色的机器和出色的产品之间有什么区别?设计。不仅在实用功能方面,而且在整体品牌设计方面。将您的品牌设计视为事后的想法意味着您并没有真正将客户放在首位。事实上,品牌、设计和技术都应该被视为一个整体,以带来最终的用户体验和一致性。

Everyone loves simplicity
每个人都喜欢简单

That may seem obvious, but in the world of technology, it can often feel like only the beginners get an easy ride. Why should more advanced technology not be simple too?
这似乎是显而易见的,但在技术领域,通常感觉只有初学者才能轻松驾驭。为什么更先进的技术也不应该简单呢?

So, no matter what you’re building or creating, or who you’re making it for, everyone will thank you for making it easier — even if they already know how to do certain tasks. It’s a question of looking at processes, and even established ways of doing things, and asking if it can be done simpler. Then asking how your UX and brand design can help.
因此,无论你在构建或创造什么,或者你为谁制作它,每个人都会感谢你让它变得更容易——即使他们已经知道如何完成某些任务。这是一个查看流程,甚至是既定的做事方式的问题,并询问是否可以做得更简单。然后询问您的 UX 和品牌设计如何提供帮助。

Even in the world of domain names, recurring frustrations like connecting and configuring products after purchase are commonplace. Look at how your product or customer problems can be solved through simple actions, or even automatically initiated.
即使在域名领域,购买后连接和配置产品等反复出现的挫折也很常见。看看您的产品或客户问题如何通过简单的操作来解决,甚至自动启动。

"Why is it that everyone thinks only newbies and novices should have simplicity? Why can’t pros like webmasters or designers have simplicity too? Simplicity is universal, so we aim to create a platform for everyone to make the most of their web presence — everyone." - Henrique Guedes, UX Manager at Spaceship
“为什么大家都认为只有新手和新手才应该有简单性呢?为什么网站管理员或设计人员等专业人士不能也拥有简单性呢?简单性是普遍的,因此我们的目标是为每个人创建一个平台,以充分利用他们的 Web 形象 - 每个人。- Henrique Guedes,Spaceship 的 UX 经理

Shape the design 塑造设计

So your technology needs to be shaped to make it easy for customers i.e. by design. This not only means looking at solving customer problems, but also creating unified, consistent design elements and systems. The overall brand needs to be created using this approach too, as a key catalyst for simplicity and usability.
因此,您的技术需要经过塑造,以便于客户使用,即通过设计。这不仅意味着着眼于解决客户问题,还意味着创建统一、一致的设计元素和系统。整体品牌也需要使用这种方法来创建,作为简单性和可用性的关键催化剂。

Build a design framework 构建设计框架

Making everything simple is easy in theory, but in reality we live in a multi-disciplined world, covering different expertise, processes, and teams. Vital to making everything run like clockwork is developing a ‘brand system’ framework.
让一切变得简单在理论上很容易,但实际上我们生活在一个多学科的世界里,涵盖了不同的专业知识、流程和团队。要让一切顺利运行,关键是开发一个 “品牌系统 ”框架。

The system should be developed to serve alongside, and also shape, your brand guidelines. Focusing on the creation of reusable components, patterns, and templates across your website, interfaces, dashboards, and app creates the building blocks of the entire brand presence. This approach helps:
该系统的开发应该与您的品牌指南一起服务,并塑造您的品牌指南。专注于在您的网站、界面、仪表板和应用程序中创建可重用的组件、模式和模板,可以创建整个品牌形象的构建块。此方法有助于:

  • Bring an extra layer of consistency across absolutely everything
    为绝对所有内容带来额外的一致性
  • Speed up production and deployment in the fast-paced tech world
    在快节奏的科技世界中加快生产和部署
  • Create a unified platform bringing the website, interfaces, etc, together
    创建一个统一的平台,将网站、界面等整合在一起
  • Allow for fast evolution (and revolution) in an ever-changing web industry
    允许在不断变化的 Web 行业中快速发展(和革命)

On a human level, it also facilitates closer collaboration across Brand, Design, Marketing, Product, and Technology teams, as solutions are found and processes are created more universally.
在人性层面上,它还促进了品牌、设计、营销、产品和技术团队之间更紧密的协作,因为找到了解决方案并创建了更普遍的流程。

“Ensuring that design systems are flexible enough to accommodate rapid technological changes while maintaining visual and functional consistency is key. Bridging the gap between creative vision and technical feasibility often required innovative problem-solving and close collaboration between designers, engineers, and wider stakeholders too. This is a system for human relationships.” - Rodrigo Melo, Head of Design Innovation at Spaceship
“确保设计系统足够灵活以适应快速的技术变化,同时保持视觉和功能的一致性是关键。弥合创意愿景和技术可行性之间的差距通常需要创新的问题解决方式以及设计师、工程师和更广泛的利益相关者之间的密切合作。这是一个人际关系系统。- Rodrigo Melo,Spaceship 设计创新主管

Spotlighting the system  聚焦系统

Efficiency and reusability
效率和可重用性

At the heart of the design system sits the philosophy of reusability, with core components, patterns, and templates designed to allow quick deployment, alongside more dynamic and open iterations.
设计系统的核心是可重用性理念,其核心组件、模式和模板旨在实现快速部署,以及更动态和开放的迭代。

Accessibility compliant 符合辅助功能要求

Going beyond mere compliance, your design system should provide accessible design patterns and components that enhance user experience without compromising usability.
除了合规性之外,您的设计系统还应提供可访问的设计模式和组件,以增强用户体验,而不会影响可用性。

Scalable and mutable 可扩展且可变

This means accommodating changes, like theming and color palette adjustments, to key components. Making them adaptable to individual product, customer, or process needs without starting from scratch.
这意味着要适应对关键组件的更改,例如主题和调色板调整。使它们能够适应单个产品、客户或流程需求,而无需从头开始。

Unified self-service 统一自助服务

Empowering your teams and third-party providers with the tools, processes, and documentation necessary for quick minimum viable product (MVP) solutions and iterative development.
为您的团队和第三方提供商提供快速最小可行产品 (MVP) 解决方案和迭代开发所需的工具、流程和文档。

Everything should be accessible and constantly updated in libraries covering:
所有内容都应该在库中可访问并不断更新,包括:

  • Foundations: fundamental visual and structural elements like typography and pallets
    基础:基本的视觉和结构元素,如排版和模块。
  • Components: stand-alone UI elements engineered to specific functions, but able to adapt
    组件:针对特定功能而设计的独立 UI 元素,但能够适应
  • Templates: blueprints for entire website pages and other assets ensuring a consistent presence
    模板:整个网站页面的蓝图和其他资产,确保一致的存在

Creating an integrated visual brand
创建综合视觉品牌

Underneath it all — the technology, the UX, the problem solving — it is still important to make sure your brand stands out and has an emotive impact. Being able to attract new customers is also vital, after all. But you need this brand identity to work with your overall system.
在这一切的背后——技术、用户体验、问题解决——确保您的品牌脱颖而出并产生情感影响仍然很重要。毕竟,能够吸引新客户也很重要。但是您需要此品牌标识才能与您的整个系统配合使用。

“Having a beautiful visual brand that not just reflects but emphasizes innovation was key. Being able to show, and not just tell, is a powerful thing. At the same time, having visual simplicity stays true to our overall usability goals, while actually adding to the beauty.” -Spaceship’s Head of Website Platform and Digital Marketing, Marina Zhuravlova
“拥有一个不仅反映而且强调创新的精美视觉品牌是关键。能够展示,而不仅仅是讲述,是一件很有力量的事情。同时,视觉上的简洁性忠于我们的整体可用性目标,同时实际上增加了美感。-Spaceship 网站平台和数字营销主管 Marina Zhuravlova

Visual brand principles 视觉品牌原则

While innovation is indeed a powerful things, sticking to the tried and tested method of embedding brand principles still plays its part. Make sure you have these essential elements to guide the creative aspects of your branding.
虽然创新确实是一件强大的事情,但坚持久经考验的嵌入品牌原则的方法仍然发挥着作用。确保您拥有这些基本要素来指导品牌的创意方面。

Universal & timeless 通用且永恒

Your brand must be able to speak to a wide audience regardless of gender, age, culture, or location. What is created today should be valid in the future. Avoid obvious and figurative representations and focus on the essence of the message. Escape literal and clichéd approaches.
您的品牌必须能够与广泛的受众对话,无论其性别、年龄、文化或位置如何。今天创建的内容在未来应该有效。避免明显的和比喻性的表示,并专注于信息的本质。摆脱字面意思和陈词滥调的方法。

Physical & non-physical 物理和非物理

There are no boundaries to the imagination, so explore and merge different worlds. Go beyond the obvious and embrace true inspiration. The universe of ideas, the digital realm, and the material world are all there to spark your imagination.
想象力没有界限,所以探索和融合不同的世界。超越显而易见的事物,拥抱真正的灵感。思想世界、数字领域和物质世界都在那里激发您的想象力。

Pure and simple 纯粹而简单

Sophistication comes through simplicity. Acknowledge the power of purity and focus on removing noise to reveal the true essence of things. This doesn’t mean that our style should be soulless and empty. The way we overcome complexity is inevitably through beauty.
简单就是精致。承认纯洁的力量,专注于消除噪音,揭示事物的真正本质。这并不意味着我们的风格应该是没有灵魂和空洞的。我们克服复杂性的方式不可避免地是通过美。

The practical application of beauty
美的实际应用

Of course, a vibrant color palette is important, alongside the right fonts. But they are brand basics. The true challenge lays in achieving aesthetic goals in a systematic, modular way that world within your overall design system. It’s not just about creating beautiful web pages, but beautiful and consistent experiences. This is where an illustrative approach can come in very useful.
当然,鲜艳的调色板以及正确的字体很重要。但它们是品牌基础。真正的挑战在于以系统化、模块化的方式实现整个设计系统中的美学目标。这不仅仅是创建漂亮的网页,而是美观且一致的体验。这就是说明性方法非常有用的地方。

Visual language 视觉语言

Like any written language, the ability to build words and sentences is only possible by the existence of an alphabet. Although it is tempting to represent more complex technology through complex compositions, aiming for simplicity and a more immediate emotional impact is always preferable.
与任何书面语言一样,只有通过字母表的存在才能构建单词和句子。尽管通过复杂的构图来表现更复杂的技术很诱人,但以简单和更直接的情感影响为目标总是更可取的。

Micro illustrations 微型插图

These can be used to clearly visualize products and their functionality, while creating a balance between the literal and emotional aspects of the brand.
这些可用于清晰地可视化产品及其功能,同时在品牌的文字和情感方面之间创造平衡。

Pictograms 象形图

Used to give prominence and enhance the usability of specific web components, pictograms are primarily used to communicate a concept quickly and in smaller sizes. They use simple geometry to make sure that pictograms are sharp, easily recognizable, and will communicate a concept quickly.
象形图用于突出和增强特定 Web 组件的可用性,主要用于以较小的尺寸快速传达概念。他们使用简单的几何图形来确保象形图清晰、易于识别,并且能够快速传达概念。

Icons 图标

Used to give prominence and enhance the usability of specific components across the interface, icons’ primary goal is to communicate a concept quickly and in limited space.
图标用于突出和增强界面中特定组件的可用性,其主要目标是在有限的空间内快速传达概念。

Bringing products and categories to life
让产品和品类栩栩如生

Your products will all have different selling points or target audiences, and it’s important to guarantee they can easily be distinguished. To match a systemic approach with visual creativity, try creating brand concepts for each core product and category. These help distill products and categories down to their true essence.
您的产品都会有不同的卖点或目标受众,因此确保它们很容易区分非常重要。要将系统方法与视觉创意相匹配,请尝试为每个核心商品和品类创建品牌概念。这些有助于将产品和品类提炼成其真正的本质。

For Spaceship, the concept was built around a “core” to represent the central role a domain name plays in starting online ventures — “The origin and expansion of everything”.
对于 Spaceship 来说,这个概念是围绕一个 “核心” 构建的,以代表域名在启动在线企业中发挥的核心作用 — “万物的起源和扩展”。

  • Domains: “The origin and expansion of everything”
    域:“万物的起源和扩展”
  • Web Hosting: “The power that sustains it all”
    虚拟主机:“维持这一切的力量”
  • Security: “The freedom to prosper through safety”
    安全:“通过安全实现繁荣的自由”

Building the digital future together
共同构建数字化未来

Putting design at the heart of technology is not just about making for a better customer experience and a more consistent, compelling brand. It will help your entire business adapt quickly. This is especially important for newer ventures that need to adapt and pivot. In the case of Spaceship, it actually helps customers become part of it’s evolution.
将设计置于技术的核心不仅仅是为了提供更好的客户体验和更一致、更引人注目的品牌。它将帮助您的整个企业快速适应。这对于需要适应和调整的新企业尤其重要。就 Spaceship 而言,它实际上帮助客户成为其发展的一部分。

Through initiatives like the Spaceship Roadmap, anyone can suggest, check, and vote on new features. The most popular are prioritized for development and release. So the ability to deploy a comprehensive yet adaptable design system quickly is critical to meeting customer expectations.
通过 Spaceship Roadmap 等计划,任何人都可以对新功能提出建议、检查和投票。最受欢迎的被优先开发和发布。因此,快速部署全面且适应性强的设计系统的能力对于满足客户期望至关重要。

Ultimately, prioritizing good design is the key to delivering not just a great customer experience, but delivering a better digital business. Constantly adapting to changing needs, while maintaining brand and performance consistency.
归根结底,优先考虑好的设计不仅是提供出色客户体验的关键,也是提供更好的数字业务的关键。不断适应不断变化的需求,同时保持品牌和性能的一致性。


Previous 以前
Next 下一个