Member-only story
1. Wireframe
A wireframe is a simplified representation of your website or application. It consists of lines and text that can be hand-drawn or electronic. The focus of the wireframe should be structural elements that represent priority. In this stage, visual design and color are not presented. Like the picture shown below.
2. Mockup
A mockup is a high-fidelity simulation of the product. It has a richer visual element than wireframe, including graphics, layout, and style. Mockups focus on how the users will interpret the design through its visual elements.
3. Prototype
Compare to wireframes; prototypes are more flexible. They can be responsive and may contain images or content. Prototypes are made from paper or digital tools like Adobe XD. All wireframes are prototypes but just low fidelity without many details. But a high-fidelity prototype is not a wireframe. It takes you as close as to a real UI representation and should feel like real software to users.
4. A/B Testing
A/B testing is a controlled experiment for comparing two versions of the design. The goal is to identify which one is more successful. It is a way of testing the designers' hypotheses. A/B testing allows them to confirm whether the hypotheses will work out well or not. It helps you with making the right decisions.
