Theme

Text size

Reading width

Line spacing

Font

Accent

0 of 0 0%

TRACK 3

🛠️ Production

Create useful interfaces and images, and compare models without losing control of the configuration.

3 modules One step at a time
18 topics Reading with notes
~1h45 Estimated with practice
Practical application Commented examples
STEP 1 Understand STEP 2 Apply STEP 3 Check STEP 4 Deliver STEP 1 Understand STEP 2 Apply STEP 3 Check STEP 4 Deliver
Give shape to your decisions.

Track map

3.1 ~35 min

🛠️ Interfaces that help you act

An exit that makes sense.

3.2 ~35 min

🛠️ Images with a clear brief

Less guessing. More evidence.

3.3 ~35 min

🛠️ Models and configurations without confusion

Practice and close the step.

Detailed content

Module 3.1 ~35 min with practice

Interfaces that help you take action

Improve a page with the user’s task, using visual decisions you can justify.

0 of 0 0%

What is it
An interface organizes decisions.

Why learn
Action clarity lets you evaluate the design by how it’s used. You can ask whether the person found and completed the task, instead of discussing only personal taste.

Key concepts
Task · Hierarchy · Primary · Alternative

What is it
Record the current page and identify concrete issues: cut-off text, ambiguous label, low contrast, or difficulty locating information.

Why learn
A specific observation leads to a smaller, easier-to-check intervention. The previous record lets you compare the result without relying on memory.

Key concepts
Baseline · Problem · Intervention · Regression

What is
When requesting layout options, keep content and purpose constant.

Why learn
Comparing proposals with the same data prevents one option from looking better just because it uses less content or hides a difficult state.

Key concepts
Criterion · Variable · Constant · Constraint

What is
A UI needs to handle an empty list, loading, error, success, and long data.

Why learn
Difficult states are part of the real product. Considering them prevents the page from working only with the short, complete data used in the demo.

Key concepts
Empty · Error · Focus · Extreme

What is
Small text and low contrast require more effort to read.

Why learn
Reviewing makes visual improvement inclusive and measurable. You avoid approving a beautiful design that makes reading harder or loses functionality on mobile.

Key concepts
Contrast · Reflux · Target · Scale

What is
Use a fake table with five orders, including a long name and a missing deadline.

Why learn
The exercise combines diagnosis, intervention, and testing. The habit of justifying each change helps maintain consistency when other people join the project.

Key concepts
Before · After · Rationale · Verification

See Full
Module 3.2 ~35 min with practice

Images with a clear brief

Turn a visual idea into comparable instructions and a consistent set.

0 of 0 0%

What is
A cover image needs to communicate a topic; a product image needs to show features; a diagram needs to explain relationships.

Why learn
The function guides evaluation. Instead of choosing only the most impressive image, you choose the one that communicates best what the piece needs to say.

Key concepts
Function · Audience · Context · Focus

What is
Separate topic, composition, style, proportion, text, and constraints.

Why learn
A structured brief lets you change only what needs to change. This reduces accidental variation across images in the same series.

Key concepts
Topic · Composition · Style · Constraint

What is
If the image needs to contain words, provide the exact text and check every character in the output.

Why learn
An appealing image can fail on the most important information. Separating visual base and typography gives you control when textual fidelity needs to be high.

Key concepts
Exact text · Typography · White space · Final size

What is
Test one simple brief and another that combines several constraints.

Why learn
Hard cases teach where the process needs human review. The controlled comparison avoids wasting attempts without learning from the results.

Key concepts
Simple case · Edge case · Variable · Record

What is
Save the brief, the model used, the dimensions, and available parameters.

Why learn
Consistency comes from observable rules and reviewing the full set. A recipe lets you continue the series without relying on the memory of whoever created the first piece.

Key concepts
Recipe · Constant · Variation · Curation

What is
Prepare three briefs for a fictional series about organization, research, and delivery.

Why learn
Practice produces a small system of visual decisions. It can be reused for module covers, presentation materials, or project documentation.

Key concepts
Series · Brief · Evaluation · Record

See Full
Module 3.3 ~35 min with practice

Templates and configurations without confusion

Compare alternatives with the same task and preserve the way back.

0 of 0 0%

What is
A model must be evaluated by the work it’s supposed to do.

Why learn
Comparison stops depending on generic rankings. You start evaluating the cost and the quality of the delivery you actually need to produce.

Key concepts
Capacity · Quality · Latency · Total cost

What is
The interface is the program you interact with.

Why learn
Understanding layers helps you locate failures and avoids attributing an authentication, network, or interface configuration problem to a model.

Key concepts
Interface · Provider · Model · Authentication

What is
A profile describes settings, but it shouldn’t be used as a store for credentials.

Why learn
Separating configuration and credential makes it easier to share examples without exposing access. Keeping the original configuration makes the test reversible.

Key concepts
Profile · Variable · Credential · Backup

What is
Start with a small request, without important documents.

Why learn
Step-by-step verification separates connection issues from functional limitations. You avoid discovering incompatibilities after you’ve already started a long task.

Key concepts
Connectivity · Identity · Function · Minimum test

What is
Use the same set of inputs and record results by criterion.

Why learn
A comparable matrix shows advantages and limitations without turning preference into evidence. It also allows you to repeat the evaluation when the service changes.

Key concepts
Ruler · Sample · Variability · Decision

What is
Define a task to extract three orders and compare two fictional profiles.

Why learn
The exercise produces an evaluation protocol that can be applied to real services afterward. It prevents a configuration change from being mistaken for a demonstrated improvement.

Key concepts
Protocol · Simulation · Reversal · Choice

See Full
Preview of the module