I’m working on a small word-puzzle interface and have been thinking about how much information should be visible on the first screen. A typical puzzle can have the main challenge, instructions, input controls, feedback for correct or incorrect attempts, and sometimes things like hints, a progress indicator, or a history of previous attempts. Putting everything on one screen can make the layout feel crowded, but hiding too much can make the interaction less obvious.
For example, with a Letter Boxed styled interface, the central puzzle area needs to remain visually dominant while the surrounding controls still need to be easy to understand. I’m particularly interested in how people approach the hierarchy between the puzzle itself, instructions, action buttons, and feedback states when designing this type of experience.
If you were building this in Figma, would you start with the interaction flow and prototype the states first, or establish the visual hierarchy and component system before adding the interactions? What layout or prototyping techniques have worked well for keeping this kind of interface simple without removing useful information?