I love techniques that allow designers and developers to “break” the boxed in nature of web design in a general sense. As a micro trend, non-rectangular headers have become one of my favorite techniques to accomplish this ask.
So, how do I do this?
Per CSS-Tricks, there are several methods available to accomplish this particular task:
- Background images, which appears to be one of the weaker methods
- Inline svgs, which can be modified pretty well, and reduce the load on the browser
border-radius, which allows for the more convex circular look
clip-path, which appears to have browser compatibility issues
- And my favorite,
The Stripe home page using
As mentioned above, my preference in this case is
transform: skew, although it introduces extraneous elements to the page–a seemingly forgotten rule is to not do so for presentational purposes–but this can certainly be accomplished with pseudo elements.
The article referenced above uses an extra element in the document to create the effect–which is perfectly reasonable–as does the stripe website.
Stripe’s homepage design uses this method, and even more brilliantly, they include a few children spans (each is a block of color) that get skewed with the parent element, creating a more complex and colorful effect.
I don’t entirely know that I like the extra elements, but I come from a slightly different era of development that saw this technique of creating decoration-only elements as heresy, while still using it regularly.
Anyway, I enjoy looking at the sorts of things that front end devs do to accomplish what UX/UI designers come up with.
A frontend designer (who may also go by UI developer, client-side developer, UI engineer, design engineer, frontend architect, designer/developer, prototyper, unicorn, or Bo Jackson) lives in a sort of purgatory between worlds
This is my life. I am often shoe-horned into the role of pure developer, when in reality I’m a designer that develops for the front end. Organizations that I’ve worked with in the past tend to separate the two, and this puts me in the precarious position of having to choose between them. Or those who don’t understand my skill set tend to take me with them when they need a technically minded individual to interpret and discuss a topic.
While some of this organizational separation may be justified, creating a division between designers and frontend developers is an absolutely terrible idea.
He mentions how he thinks that front end designers are particularly well-suited to bridge the divide between design and development and I couldn’t agree more. It’s a key skill set in any organization that creates and designs user interfaces.
Brad Frost is also referencing the article Development is Design.
Coca-Cola is switching gears with a new packaging strategy, according to AdAge. Their focus is going to be on variants of Coca-Cola rather than on separate brands depending on consumer desire.
Earlier this year, Mr. de Quinto told Ad Age that loyal consumers “always have loved the brand Coca-Cola.” But “there are moments when this consumer wants to reduce their sugar intake.” In those cases, Coke was forcing people to buy into a completely separate identify, he explained, referring to Diet Coke and Coke Zero.
He goes on to describe how this strategy implied that the product wasn’t really for everyone–that it wasn’t all inclusive–and that’s an intriguing notion.
Proposed product lineup. Photo from Coca-Cola, used at AdAge
Same family but no different–they’ve changed nothing about the product.
From an aesthetic standpoint, I love this strategy. Everything feels like a product family, the approach is clean, and the rationale surrounding it seems rather intriguing. By positioning these options as variants of Coke, rather than separate products, I wonder if it will create confusion in-store or if this will seem like a natural evolution for consumers?
Overall, I’m curious to see what it looks like when it is introduced later this year.
In principle, it is a great idea for designers to understand business principles, but I’m not certain that we should discourage the learning of one of the core disciplines of design and one of the toolsets needed in this world that we live in. Strategic thinking requires understanding the ebb and flow of business and how the consumer thinks and reacts. Design is as much a part of business as anything else is–the two are inherently inseparable–it’s just that good design is not always a part of the strategic thinking of the business world.
All of those things are good — mandatory even. But for us to truly understand the best way to help a business we have to start focusing on what makes the business successful. We must first understand business in general. Then we will better understand where craft is important (and where it is excessive).
Instead, designers are often seen as someone that needs to have the important business goals explained to them in the most basic of ways. I think our suggestions about design would carry a lot more weight if we were able to have insightful conversations, and offer valuable suggestions about core business principles.
I can’t argue with that thinking, but that’s why design has many moving parts. So that some can direct others with the larger business strategy in mind.
“Have you ever talked to talented people, watched their hands shaking…there’s a set of nervous reactions that we have when we’re faced with sub-standard work,” Ford said.
What an intriguing perspective from Paul Ford. The idea that talented individuals can show their talent by demonstrating their attention to detail on a given subject.
He defines talent as, “the demonstrated ability of an individual, when they perceive errors of form, to take specific actions to correct those errors.”
That is not an idea I would have every really conflated with a specific level of talent, but it makes sense as a marker for it.