UX Planet — Medium | Tarun Kohli

“Lorem ipsum dolor shit meet, consequences despicable elite, sad do eew mod temper indignant um la-BORE etc doling magnanimous ashit.”

The popular Latin text which had become synonymous to ‘dummy text’ or ‘filler text’ has finally started to fade away, thanks to the smarter, more empathetic people in the design community. It does not imply that there was a dearth of good designers before, it just means that product designers have now become intolerant to scrambled text which made design layouts incoherent and unrealistic.

What harm can ‘Lorem ipsum’ do to my designs?

Short answer — It can do severe harm! Think about jumping out of the plane without a parachute. Yeah, that kind of harm. Seriously.

Long answer — Ignore the short answer. It was full of crap. Just like Lorem ipsum is. 🙂

Well, the point is that it makes designers complacent. Okay, I meant to use the word lazy but I’m sure you get the drift.

It also robs the eventual design of character. Rather than truly understanding how the designs would be used, Lorem ipsum just sits there like a dress that looks great on a mannequin but doesn’t tell you anything how the same dress will look on you!

Reality is different.

Data in the applications doesn’t wear the garb of “Lorem ipsum”. It relates to things around us-whatchamacallit-like names, quantities, descriptions, sizes etc.

I can’t begin to tell you how many pretty designs have fallen apart completely once real data has been injected into the interface.

To me, Lorem ipsum is like the communist phenomenon where every UI widget gets the same size of text.

To me, Lorem ipsum is like a basketball coach who can’t differentiate between Stephen Curry and Lebron James.

To me, Lorem ipsum is like one size window to all kinds of walls. No matter how small or big. It doesn’t take into account the size of the wall. Whether this window would even be usable in that wall.

Okay, we get it. Enough already with mixing mindless analogies of Lorem ipsum. We get the point that you don’t like Lorem ipsum. Let’s stick with the wall analogy. Will you please move on now?

Geez…stop being so controlling. Okay, fine…let me go with the wall analogy.

When designing a window, wouldn’t one want to know the size of the wall so that window could be placed appropriately?

Data is the same way. One has to know the kinds of data that can be placed in the specific UI widget. One has to ask to understand the UI widget in detail-

1. What’s the minimum amount of data that can be held?
2. How would the space around collapse when there isn’t any data?
3. What’s the maximum size of the data that can be held? Once the data overflows in a widget, would the design show ellipsis or a “Read More” link.

Understanding the real data makes application design realistic. People can look at it, understand, dissect and critique it well.

Without the data or with Lorem ipsums, the designs have no soul. They lack character and realism. And, that’s the downside. A big downside.

Why data should be primary to design?

From my experience, designing with data should be given importance just like any other tasks in the process. If you design with data, you will understand be able to understand the application flow better and design a better experience.

A most common wireframe with Lorem ipsum text would look like this:

It seems fine, doesn’t it? After all, the whole structure was meant to be a perfect fit to the Lorem ipsum text. But hold on! What do you think will happen to the page layout when it’s time to add the actual content?

The probability that your actual content will occupy the same allotted space as you imagined, is a question of high doubt. Almost implausible. In maximum cases, you would need to restructure it, which is a complete waste of time. And, energy.

So you must either start all over again with a new design template, or modify the content to forcefit it by losing some part of valuable information.

Developing content early might appear as a menial task to be put on the priority list but wouldn’t it be better to alter a design around the data rather than modifying the data around design?

Real world is complicated, so use real data in your designs.

Don’t get me wrong — I do not expect your content to be perfect and apt in the first go. In fact, you should not spend much time in adding content. The data doesn’t need to be finished early; but it should be started early.

Sure, it’s a time consuming task but it’s high time you wake up and see the slogan “content is the king.” It’s everywhere. Your aesthetically attractive designs need to be ‘filled in’ right now. Jeffrey Zeldman hits the nail on the head with this epic quote- “Content precedes design. Design in the absence of content is not design, it’s decoration.’

The design and flow of a mock-up with Lorem ipsum is a waste because all those nonsensical words have no significance and they will eventually be replaced.

At Quovantis, we believe in designing with real data. Here’s how we have streamlined our approach to design-

1. Work with product owner to get real content examples

Designers will insist clients for providing the content before they commence on their design mockups. For instance, if you’re building the next app like Uber (hey, shameless plug, we are…check out DUDE), work with the product owner to get the kind of data they would like to see in their application. This might include driver names, city address, postal code or success/error messages.

This will ensure that when you go out in the real wild world, the layout that you had in mind looks the same and items are not bumping into each other because of varying length.

2. Try to gather minimal and fully flushed out examples of data

Humans are fickle minded. They themselves are not aware of what they need. For this reason, as a designer you should dig deeper into your user’s problem. This is where getting user feedback becomes crucial. Try to collect fully flushed out examples of every mock-up screen. Consider every possible scenario while brainstorming. For example, if you’re designing a newsfeed for a Facebook like application, you should create different screen snippets that cover all scenarios with variable text length.

3. Make sure the application flow uses the same dataset consistently

To get rid of inconsistencies in your design mock-ups, it is important that you use the same dataset consistently throughout screens. For instance, if your home screen shows four profiles, then the edit screen should have one of those profiles. It’s a rewarding experience to see the screens and components flow one after another with ease.

These were only a fraction of our many design practices that we follow at Quovantis. Data, being an integral part of it. Of course, that’s how we end up crafting a great design, every single time.

Okay, I lie. May be not every single time. We have failed too but that line looked stellar.

This post is second in the design series. My first post was How to Design Better User Experiences with Empathy

Why Lorem ipsum is the word we don’t talk about anymore was originally published in UX Planet on Medium, where people are continuing the conversation by highlighting and responding to this story.