TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Design Without Color First

105 点作者 febin超过 6 年前

16 条评论

everdev超过 6 年前
The points all make sense, but anytime I&#x27;ve tried to show clients anything less than a high fidelity mock-up (wireframes, design palette, b&#x2F;w mockups, etc.), I&#x27;ve been meet with something been indifference and guarded acceptance.<p>Most of my clients (who have marketing but not design backgrounds) want that &quot;wow&quot; factor when they see the first mockups. By easing into the designs I felt like I lost that.<p>As a designer I realized I wasn&#x27;t just delivering a JPG, but a design experience. My clients seemed to equally enjoy putting their mark on the design and imaging the same &quot;wow&quot; factor their CEO would feel when they saw the latest iteration.<p>So, while I love this process for personal projects or for companies familiar with the design process, for the average marketing team I&#x27;m still going full color mockups.
评论 #19146984 未加载
评论 #19150050 未加载
评论 #19146861 未加载
评论 #19146874 未加载
评论 #19147475 未加载
mithr超过 6 年前
This sounds similar to the advice often given to budding photographers back in the day -- learn the ropes on black and white film, and only then move into color.<p>Focusing on B&amp;W forces you to work on your composition and be able to produce an interesting, captivating image without letting colors &quot;compensate&quot; for subpar composition by drawing the eye to a brightly colored object or patch. Even if you&#x27;re mainly interested in color photography and eventually want to focus on properly using colors, starting without them will give you a foundation that you might otherwise never acquire.
评论 #19147782 未加载
评论 #19147861 未加载
munificent超过 6 年前
I&#x27;ve done this several times with my own design because otherwise I tend to get lost tweaking colors for hours. It&#x27;s been a good technique to get me unblocked and moving forward.<p>At the same time, I&#x27;ve found that when I circle back to add color to the resulting design, it gets even harder to choose an interesting palette. I get used to seeing it monochromatic and adding vibrant colors looks &quot;wrong&quot; to me, so the end result is often less saturated than I really prefer.<p>Much of this is probably because I&#x27;m just not very skilled at working with color.
评论 #19148370 未加载
crazygringo超过 6 年前
Sorry but I completely disagree.<p>This makes as much sense as designing without different font sizes, designing without borders, or designing without rounded corners so everything is rectangular.<p>Visual design has a vocabulary where everything can be a useful tool for differentiation, but which requires a visual balance between too much uniformity and too much variety.<p>Arbitrarily removing color as a tool and treating it as an &quot;extra&quot; to be added back in later makes as much sense as writing a program that organizes code and variables into separate files instead of separate classes, and then adds back classes later.<p>Certainly, sites should still be completely usable by the colorblind, but color is in no way an &quot;extra&quot;. It is functional, and treating it merely as ornament instead will lead to a more limited, more likely worse design -- the same as if you limited yourself to a single font size and were unable to draw extra attention to headings over body text, for instance.<p>And if you want to focus solely on layout? That&#x27;s what wireframing is for, and you ignore <i>everything</i> else, not just color.
评论 #19148324 未加载
评论 #19147439 未加载
评论 #19148693 未加载
评论 #19148665 未加载
评论 #19149158 未加载
nategri超过 6 年前
I would add that this approach would also help you design interfaces that are more friendly for colorblind users.
erickhill超过 6 年前
I used to do this a lot when I worked at a design firm and the branding&#x2F;color hadn&#x27;t been defined. It did help quite a lot at times. But for some clients it caused annoyance&#x2F;confusion at first.
Theodores超过 6 年前
This is still visual design instead of content driven design. Design is how it works, not what it is supposed to look like when the content has been added after the project has been handed over.<p>From the tools used in the article - Squarespace - I imagine this is how best to make &#x27;div soup&#x27; rather than premium content that has excellent document structure and accessibility built in as a consequence.<p>If you get document structure right by starting content first and making sure that a story is told (even if it is just a product page) then you can then go from there to the final visual design relatively easily. If you want to change the thing wholesale for different colours then you can. But you have to be working with CSS Grid and CSS variables instead of &#x27;div soup&#x27; with trillions of classes to be able to take this more modern content first design approach.<p>If working content first then you can work on the visuals as you go. For instance you might find that the captions are not always working with images on all device types due to there being too much text. Then you can work on your content to maybe put the captions into a &#x27;details&#x2F;summary&#x27; element that solves that design problem elegantly whilst also improving the document structure. Also, because you are working with real content with real images you can find out what colours work. Because you are merely using CSS variables you can also see what happens when you change the --background-color to Papaya Whip to see if that helps more than the monochrome you started with.<p>At some time some people in this industry have to get off the div soup and the big up front designs that have to be cast in stone and handed over to developers to &#x27;paint by numbers&#x27;.
deltron3030超过 6 年前
Do you start from scratch, or with your own boilerplate that you have developed over time as a designer?<p>Because then you&#x27;ll most likely already have color palettes that work on a general level, and different component archetypes that are easily adjustable for any brand.<p>I mean, why not bake your taste and experience into your own design system that you then use for other project specific design systems as a starting point?
strokirk超过 6 年前
To play the devil&#x27;s advocate: I&#x27;ve been given rough wireframes without color before, where we didn&#x27;t have enough time to add color later on. The feedback from customer was that the design looked unfriendly and out of touch with the rest of the product.<p>Then again - it might have been because I was unfamiliar with frontend coding, or that we didn&#x27;t really go past the wireframes stage.
评论 #19146841 未加载
eankeen超过 6 年前
When just starting out with website development, I designed without color. It proved effective because I did not have to worry about fiddling with colors. However, I don&#x27;t design without colors for the simple reason that I can easily incorporate colors into my design without thinking. I use a color scheme called open-color for all my projects. If I&#x27;m using sass, for example, I just refer to the color $oc-blue-2 for a light shade of blue. I feel designing with basic colors before putting in actual color values is much better.
silveira超过 6 年前
I have being doing this for a while using Balsamiq Mockups 3.<p>The fact that everything is rendered as a low fidelity mock really helps avoid discussions like &quot;move this 2 pixels to the left&quot; or &quot;maybe this blue should be more towards green&quot;. The exceptions are set in wireframe and when we have a working version is a nice surprise.
organicdude超过 6 年前
This is realistic within a an internal team of designers. It doesn&#x27;t seem to fly with clients and non-sophisticated internal shareholders.
anandsatyan超过 6 年前
Agree. I&#x27;ve faced the same issue with clients before. But you can still make very attractive mockups in grayscale to impress.
graphememes超过 6 年前
Structure is just as important as _design_ or _style_.<p>Just different stages of _the process_ or _development_.
jdlyga超过 6 年前
Designing without color is textbook if you&#x27;ve taken a course in it.
franze超过 6 年前
In the zeros I wasted hours with discussions about colors, in the 10s hours with discussion about fonts.....