Find Your Own Way To Design 找到自己的设计方法

Find Your Own Way To Design 找到自己的设计方法

Yuki 顾雪Yuki 顾雪

发表于MINGLABS 公众号 Find Your Own Way To Design 找到自己的设计方法

Meet two designers and you’ll find two different points of view on how to design. There are so many books telling us the right way to design, how the process should look, but is there one perfect and timeless approach suited for everyone? I doubt it. In MING Shanghai we have designers from all over the world, we have different skin tones, we learned different cultures, we eat different foods, we listen to different kinds of music, we use different design tools. Does a standard design method really matter?

每个设计师都有不同的设计思路和方法,有太多书试图告诉我们什么是正确的设计方法,如何制定设计流程,但是否真的有一种完美且永恒的设计方法适合所有人呢?我是怀疑的,在MING Labs 的上海办公室,我们有来自世界各地的设计师,我们有不同的肤色,文化,饮食习惯,音乐喜好以及使用不同的设计工具,标准化的设计方法是否真的适用呢?

We recently completed a website project for Bloc, an agency representing photographers, stylists and illustrators here in China. We really enjoyed collaborating with them – building their site to best represent their collective of creative talent.

我们最近为Bloc重设计了网站,Bloc是一个展示国内摄影师、造型师和插画师作品的综合平台,我们很荣幸与他们合作,为他们设计最能够凸显艺术家创意才华的线上平台。

I want to share the stories behind this process. The tools, the process, decision making and design principles.

我想分享一下这个项目的台前幕后,关于我们的流程、决策和原则。

01 Design Tools
01 设计工具


I asked 3 of our designers what’s kind of tools they usually use. See if you can spot the difference…

我问了身边3位设计师他们在使用什么设计工具,你或许可以看到其中的差异。

Every designer has their own way to make things happen, and we love the diversity.

每位设计师有自己独特的方式去设计,而我们喜欢这种多样性。


This is a Slack channel we use to share thoughts, inspirations, gossip. We ask people if they’ve seen their wallet and cellphone somewhere, we share if there is an interesting article talking about why wireframes are dead. We all have different points of views, but this is embraced and celebrated.

这是我们的Slack聊天群,我们用它来分享心得,灵感,也用来八卦,找丢失的钱包或手机等,最近其中一个设计师分享了一篇关于线框图已经没用了的文章,我们提出了很多不同的看法,但我们对不同的看法持非常包容的态度。

While working on Bloc, we sought inspiration and validation from our colleagues. We shared early concepts on Slack, got feedback, got critiqued, gave critique, argued, made up and sent a lot of stupid stickers.

在做Bloc时,我们在同事们中间寻找灵感和不同的方向,我们在Slack上分享早期的概念设计,获取反馈、评论以及发各种蠢表情。

02 Design Process
02 设计流程

For BLOC, we did IxD (interaction design) at the beginning. This means we made Mi-Fi prototypes before wireframes – allowing us to explore without limitations.

在 Bloc 项目中,我们首先着手于 IxD 交互设计,我们先制作中精度原型再制作线框图,这样可以减少限制和约束。

Mi-fi prototyping is a stage between low-fi prototype (wireframes) and hi-fi prototype (final UI with user flows). It shows how UI components and contents connect with each other, which lowers the cost of failure and increase the speed of early stage communication. It’s also a quite important approach to let the clients better understand digital design, showing them how we work differently from traditional design agencies.

中精度原型是一个处于低精度原型 (线框图)和高精度原型 (UI设计稿与流程) 中间的一个阶段,它呈现的是UI元件和内容如何相互影响,这样做可以减少失误的时间消耗,也在前期提高了沟通速度。 它也是和客户沟通的一个重要途径,我们用它向客户展示我们与传统平面设计公司的不同。

Then another round of IxD design after we finish UI, it’s more about micro interactions - such as hover status. These little details are what make things awesome.

第二轮交互设计设于UI之后,更多的是微交互,比如悬浮状态等,这些细节会让整体更出色。

The difference between traditional design and digital design is all about dynamic interactions and designs. We create an open space then we let people come and think about what they want to do instead of telling them what to do, because our role is to engage but not persuade and that’s the beauty of interaction design. So a mood board or storyboard may work for a branding project but not for a digital project because we need to let people try and feel the whole experience for themselves

传统设计与数字设计的不同在于在动态中设计,我们创造一个开放式的空间,我们让人们进入这个空间,做他们想做的事而不是告诉他们应该做什么事,我们的角色是吸引而非劝导,这也是数字设计最美妙的地方。所以一个情绪板或故事板也许适用于品牌项目但并不适合数字项目,因为我们必须更早的让人们主动参与进来去感受其中的体验。

This is the first mi-fi prototype we did for Bloc, as you can see, the content is just sample text and images. What is important is that a fair overall impression is created, how the subtle movement curves match the visual tones. When you scroll up, the content blocks show up as a sequence with subtly different speeds, the sub-header tab sticks to the top when you stay in the feed, disappearing when you leave the section. The navigation on the left side tells you where you are right now and how many sections below.

这是我们为Bloc做的第一个中精度原型,你可以看到我们并没有对内容细化处理,因为更重要的是去展示我们营造的整体氛围,运动曲线是如何与视觉基调完美结合,向下滑动,瀑布流的内容模块呈序列交错呈现,头部标签栏在瀑布流区域内置顶,离开瀑布流区域后隐去,左侧的导航告知用户当前位置并提示剩余内容容量。

Only through seeing design in motion can you truly understand digital design.

只有通过动态设计才能真的理解数字设计。

03 Decision Making
03 决策

Who are we designing for? The client? Of course, but not only our client, we care about usability, performance, implementation difficulty, back-end efforts, we care about everything, and we strongly believe that sustainable design will show its value throughout the lifespan of the product.

我们为谁设计?客户?当然,但又不只是我们的客户,我们关心可用性、性能、执行难度和运营量度,我们关心全部,我们也坚信可持续化的设计理念对产品起到更长久的良性影响。

We made a solution matrix, listed every detail that we prioritized and tried to compare them with a holistic perspective. We want to help our client has a clear view of everything, find out their priorities and make the best solution for them and their clients. In this project, we provided several layouts, listed the difficulty of implementation, the effort for editors, etc.

我们制作方案矩阵,罗列所有相关因素,并全局的比较细的优先级。我们想要为客户更加清晰直观的展示对项目产生影响的所有内外因素。

This approach helps us to make rational decisions with all different stakeholders considered for.

这个环节帮助我们在各种利害中作出最优决策。


04 Design Principles
04 设计原则


We use minimal not only for visual, for us, it’s more about a philosophy to deal with such a messy world. In this project, we needed to show hundreds of artists’ work, what’s the best way to keep a balance of it? - Minimal, using no style to support all the styles.

我们不仅在视觉设计中应用极简主义,它更像是一个应对当下复杂社会的处事哲学。我们需要展示数百位艺术家的作品,什么是平衡不同风格的最好的方法?- 极简主义,用无风格来支持所有风格。

Minimal design is also good for performance and implement, we don’t want to design another fancy website which you need 5 minutes to load and make your computer scream. Imagine you are at a meetup, you want to show your website to some potential clients, and you open your website on your phone, the loading bar stops at 15%, you feel awkward then you drink another beer, your potential clients pretending nothing happened. If you’re lucky, they are nice and patient (so probably not then). Anyway, finally it’s loaded and it’s not responsive. : )

极简主义设计同时也在性能与开发环节中起到重要作用,我们不想要设计另一个需要5分钟加载且让电脑风扇狂转的浮夸网站。想象一下,你在一个社交场合想要给潜在用户展示自己的网站,你打开手机,加载进度条停在15%,你感觉很尴尬所以你又喝了一杯酒,你的潜在用户假装他们没有注意到时间的流逝,如果你运气很好他们也许看起来很有耐心虽然实际上并没有,最后终于加载完了然后你发现你的网站没有做响应式调试。

Conclusion
结论

So, that’s our behind the scenes for this project. We faced lots of challenges, our client is from a strong creative background themselves. The vibes are quite different from our geeky digital style so you can imagine how difficult for us to find agreement on design decisions. But it happens all the time, and it's our mission to build the digital bridge between art and technology. Digital is always evolving and so must we. We enjoy the process and strive to figure out how to adapt to rapid changes in the real world and design in a dynamic condition. We have strong skills, we think deeply, and we don’t want to just follow the trend and build something without its own personality. We find our own way to design, how about you?

所以,以上就是我们的一些幕后故事,实际上我们面对着非常多的挑战,我们的客户来自传统艺术领域,与我们极客设计风格很不一样,你可以想象找到共鸣或深度沟通对我们来说是多么困难的一件事,不过它经常发生,而我们的任务就是在艺术与科技之间建筑一座数字转型桥梁,我们非常享受这其中的过程,我们也在朝着一个方向不断努力着,这个方向就是,面对这个极速变动的世界,我们如何动态设计?我们拥有扎实的设计功底,我们深度思考,我们不想只是做追逐潮流的作品,因为每一个事物值得拥有它自己的属性。我们找到了自己的设计方法,你呢?

By Yuki Gu, Interaction Designer @ MING Labs


aHR0cDovL3dlaXhpbi5xcS5jb20vci93VXpFM0xiRU5PdExyZkstOXhuVA== (二维码自动识别)

「真诚赞赏,手留余香」
还没有人赞赏,快来当第一个赞赏的人吧!
文章被以下专栏收录
还没有评论
推荐阅读