Some design issues don’t require research.

You don’t need analytics, user interviews, or usability testing to spot them.

You just need to look.

This is one of those cases.

I came across a LinkedIn job post component displayed on an iPhone SE. What should have been a simple, structured UI element turned into something completely broken:

• Text split vertically into single letters
• No visual hierarchy
• CTA button floating without context
• Layout collapsing under basic constraints

This is not an edge case.

This is a failure at the system level.

---

What Actually Went Wrong

Looking at this as a product designer—not just a UI designer—this is not about visuals. It’s about missing decisions.

1. No Layout Constraints

The job title (“Senior Quality Assurance Engineer”) breaks into a vertical stack of letters.

This means one thing:

• No defined minimum width
• No rules for text wrapping
• No fallback for long content

This is not a bug.

This is a missing design rule.

2. No Information Hierarchy

The expected structure is obvious:

1. Logo (visual anchor)
2. Content (job title + context)
3. CTA (action)

Instead, everything competes for attention.

The result:

• No scanning pattern
• No visual rhythm
• No clear next step

3. CTA Without Context

The “View job” button exists—but it’s not connected to anything.

It’s not positioned as a natural continuation of the content.

It doesn’t complete the interaction.

A CTA without context is invisible.

4. No Small-Screen Testing

This is the most critical issue.

This happened on an iPhone SE.

Not a rare device. Not a fringe case.

A real, widely used screen size.

If your product breaks here, it means one of two things:

• It was never tested
• It was tested—and ignored

---

This Is Not About “Responsiveness”

There’s a common misconception in product teams:

Responsive design = scaling layouts

That’s wrong.

Responsive design = designing for context

Which means:

• Different spacing
• Different proportions
• Sometimes a different structure
• Sometimes a different component altogether

---

What This Should Look Like

On a small screen, the solution is not complex.

It’s disciplined.

A mobile-first version:

[LOGO]

Senior Quality Assurance Engineer

[VIEW JOB BUTTON]

With clear rules:

• Maximum two lines for the title
• Ellipsis or truncation for overflow
• Consistent padding (e.g., 16px)
• Full-width CTA
• Vertical stacking instead of horizontal compromise

---

Where the Process Failed

This is not a designer mistake.

This is a process failure.

1. Testing Happens Too Late (or Not at All)

Testing should not happen at the end of a sprint.

It should happen:

• In design (Figma previews)
• On real devices
• Before development
• During development

2. “Edge Cases” Are Ignored

A long job title is not an edge case.

It’s a standard scenario.

If your system breaks here, it’s not robust.

3. No System Thinking

This is not just one component.

This is part of a larger ecosystem:

• Job feeds
• Sponsored posts
• Recruitment flows

If the component fails, the system fails.

---

The Uncomfortable Question

This is LinkedIn.

A mature product. A global platform. A company with resources.

So the real question is not:

“How did this happen?”

The real question is:

“How did no one notice?”

Or worse:

“How was it noticed—and still shipped?”

---

What Should Be Non-Negotiable

• Mobile-first design
• Defined layout constraints
• Real-device testing
• Clear ownership of UX quality

Because this is not about aesthetics.

This is about whether your product works.

---

Final Thought

There’s a difference between:

Design that looks good
and
Design that survives reality

This component didn’t survive.