Bốn thứ này nằm trên cùng một trục mức độ hoàn thiện tăng dần, mỗi mức phục vụ một câu hỏi khác nhau.
Sketch — bản vẽ tay hoặc phác thô, không cần đúng tỷ lệ. Dùng trong lúc trao đổi để thống nhất ý tưởng bố cục. Giá trị nằm ở chỗ vẽ trong vài phút và bỏ đi không tiếc.
Wireframe — bố cục ở mức khung xám: vị trí các khối, thứ tự thông tin, luồng chuyển màn hình. Không màu sắc, không hình ảnh thật. Trả lời câu hỏi thông tin gì nằm ở đâu và người dùng đi qua các màn theo trình tự nào.
Mockup — bản tĩnh đã có màu, chữ, hình ảnh, đúng bộ nhận diện. Trả lời câu hỏi sản phẩm trông như thế nào. Chưa bấm được.
Prototype — bản có tương tác: bấm được, chuyển màn được, đôi khi mô phỏng cả dữ liệu. Trả lời câu hỏi dùng nó cảm giác ra sao, và là công cụ tốt nhất để kiểm chứng luồng với người dùng thật trước khi viết mã.
Phần BA thường phụ trách: sketch và wireframe, vì chúng gắn với luồng nghiệp vụ. Mockup thường thuộc về designer. Prototype tuỳ nhóm, nhưng BA hay dựng bản đơn giản để kiểm chứng luồng.
Lưu ý: đưa mockup hoàn thiện quá sớm khiến người dùng bàn về màu sắc thay vì bàn về luồng. Đây là lý do wireframe cố tình để mức thô.