Frontend Engineer
Tell me about a time a design you were given was hard to build or didn't work well in practice. How did you handle it with the designer?
What the interviewer is looking for
- This question tests collaboration with design & product. Raises feasibility concerns early, proposes alternatives instead of just saying no, and keeps designers involved through implementation.
- What to bring out: Raising the issue early with evidence, proposing alternatives, respecting design intent, and reaching a shared decision.
- Expect a follow-up like: How do you build a relationship with designers so these talks go smoothly?
Another way it may be asked: A designer hands you a screen with an animation that would hurt performance. What do you do?
A structure to follow: STAR, with the weight on Action and Result
- Step 1
Situation
One or two sentences: where, when and what was at stake. Pick a real example you were close to.
- Step 2
Task
What you personally were responsible for. Say "I", not only "we", so the collaboration with design & product you showed is visible.
- Step 3
Action
The two or three things you did and why you chose them over the alternatives. This should be about half your answer.
- Step 4
Result
What changed, in your own measure of it, and what you would do differently. Only use numbers you can stand behind.
This is guidance on shape, not a script. Use your own real experience and facts; never invent details to fill a gap. See the STAR guide and answer frameworks.
Common slips
- Describing what the team did without saying what you did.
- Choosing an example with no clear outcome, or one you cannot answer detailed questions about.
- Ending on the action and skipping the result and what you learned.
How to practise it
Write two bullet points for each STAR letter, then say the answer aloud in about two minutes.
Related questions
- How would you build a layout that looks good on both a phone and a wide desktop screen? Talk me through your approach.
- Can you explain what happens when you await a promise in JavaScript, and how you handle errors from it?
- What are some simple things you do to make sure a form can be used by someone on a screen reader or only a keyboard?
- How do you decide where a piece of state should live in a React or similar app, and when do you reach for a global store?
- A product page feels slow to load on mobile. How would you find out why, and what would you try first?