Lesson 15 / الدرس 15

Giving and taking a critique / إعطاء النقد وتقبّله

Design work is reviewed by people who cannot draw, in meetings where the loudest opinion often wins. The skill that protects your work is not defending it — it is making the conversation about the reader instead of about anyone's preference.

عمل التصميم يراجعه من لا يرسمون، في اجتماعات يفوز فيها أعلى الآراء صوتًا غالبًا. والمهارة التي تحمي عملك ليست الدفاع عنه — بل جعل الحديث عن القارئ بدل تفضيل أحد.

Two sentences decide how a design review goes. "I don't like the blue" starts an argument nobody can win, because there is no fact underneath it. "A colour-blind reader cannot tell the error state from the success state" starts a conversation with an answer. Your job in a review is to convert the first kind of sentence into the second, including when it is your own.

Giving one

Ask what it is for before you say anything. Half of all bad feedback is a correct observation about a goal the designer was not pursuing.
Describe what you see, then what you expected. "My eye went to the image first, and I expected to land on the price" is information. "The layout is wrong" is not.
Name the problem, not the fix. "I cannot find the button" leaves the designer to solve it; "make the button red" takes the design decision away and is usually wrong anyway.
Say what is working. Not politeness — a designer who does not know which parts are solved will change them in the next round.

Taking one

The instinct is to explain. Resist it long enough to find out what the person actually saw, because an explanation you have to give in the room is an explanation the reader will never get. If three people misread the same element, the element is misread — their reasons may be wrong and the observation still stands.

<div style="font-family:system-ui; max-width:420px; font-size:15px">
  <h3 style="margin:0 0 4px">Weak feedback</h3>
  <ul style="color:#666; margin:0 0 20px">
    <li>I don&rsquo;t like the blue</li>
    <li>It feels a bit empty</li>
    <li>Make the heading bigger</li>
  </ul>

  <h3 style="margin:0 0 4px">The same three, made usable</h3>
  <ul style="margin:0">
    <li>The blue is used for links and for the button, so I could not tell
        which things were clickable</li>
    <li>I read the whole card before I found the price &mdash; I expected to
        land on it</li>
    <li>On my phone the heading and the body text are the same weight, so
        nothing came first</li>
  </ul>
</div>

The right-hand versions each contain a fact and a consequence, so the designer can act without guessing, and can disagree with evidence. None of them prescribes a fix — which is what leaves the design decision where it belongs.

Try it live / جرّب بنفسك

<h1>Critique</h1>

<p><strong>What this screen is for:</strong> </p>

<h2>What I saw, and what I expected</h2>
<ol>
  <li></li>
</ol>

<h2>What is already working</h2>
<ul>
  <li></li>
</ul>

Preview / المعاينة

Check yourself / اختبر نفسك

1. Why is "make the button red" poor feedback?

2. Three reviewers misread the same element for three different reasons. What follows?

3. A senior person states a preference as a requirement. What is the useful response?

Your task / مهمتك

Write a critique of any real screen using the four rules: state its purpose, describe what you saw against what you expected, name problems rather than fixes, and say what is already working. Six observations, none of them a preference.

اكتب نقدًا لأي شاشة حقيقية بالقواعد الأربع: اذكر غرضها، وصف ما رأيته مقابل ما توقعته، وسمِّ المشكلات لا الحلول، وقل ما ينجح أصلًا. ست ملاحظات، ولا واحدة منها تفضيل.

The screen's purpose stated before any observation غرض الشاشة مذكور قبل أي ملاحظة
Six observations, each with what you saw and what you expected ست ملاحظات، لكل منها ما رأيت وما توقعت
No observation prescribes a fix, and at least two say what works لا ملاحظة تصف حلًا، واثنتان على الأقل تقولان ما ينجح