UX/UI designer and CareerFoundry graduate Risa Nakajima gives us a comprehensive look at her wireframes for Swipy-a German vocabulary learning app.
WEBSITES LIKE APPBOX FULL
To look at this wireframe and the designer’s process in greater detail, check out the full JazzBurger case study on Behance. While this may not be the exact copy that ends up on the final product, the designer has incorporated more than the traditional “lorem ipsum” placeholder copy that neglects the importance of factoring the copy into the design (not just the other way around). What we really appreciate about this wireframe is the attention given to copy so early in the design process. The design has a clear awareness of the user journey-walking us through from the homepage all the way to checkout. UX/UI and web designer, Roman Vasilovski used Figma to create this website wireframe-beyond a simple sketch, and closer to the final design than other wireframes you might see. To have a look at the full case study, visit Anami’s portfolio website. Not only does she give a full overview of her design process, but she also shows us the evolution of her wireframes-from early sketches to the final product.īut if you’d like to see one set of wireframes at a time, she’s also made those available.
Sundayz appĪnami Chan’s Sundayz app case study is one of our favorites. To look at these questions and their process in more detail, check out the Fiscal case study on Behance. The designers created it in Figma and we love that they took three questions into the wireframing process related to the user journey and to information architecture (and particularly how their information architecture and other elements could lead to more subscriptions). This wireframe includes graphic elements and copy that are quite close to what might appear in the final product. Image credit: Terezija Katona/ PopArt Studio Terezija Katona and PopArt Studio’s Fiscal website case study gives another great example of what website wireframes should look like. This comparison is a clear illustration of both the importance of copy in formulating a central message, and the kind of influence final design might have on that copy.įind out more about this project and other thought-leading initiatives at Jamal Nichols’ website. With his expertise in UX writing, Jamal takes a clearly content-oriented approach that we appreciate. Looking at another design leader’s portfolio, Jamal Nichols gives us a side-by-side comparison of his mid-fidelity wireframes and the final design of the home page of the Kyte car booking app. Learn more about this case study and other industry-leading work on Miriam Braimah’s website. Miriam used Sketch to create this wireframe and we love that she included design notes and used some simple color coding to note active elements on the screen-highlighting the user flow. Inflection websiteĭesign leader Miriam Braimah gives us a glimpse into the process of creating Inflection-a community safety web portal. Michelle follows this with a look at a more developed wireframe, which-by the looks of the tools she lists in her resume-she created in Adobe XD or Sketch.
First, we get a look at the initial sketches: UX designer and CareerFoundry graduate Michelle Lock provides a glimpse into two sets of wireframes she created for a fitness app. Drawing from Dribbble, Behance, and individual designers’ portfolios, we’ll share each example along with what type of wireframe it is (app or website) and what we love about it. We’ve gathered 9 of our favorite examples of app and website wireframes from across the web.
0 kommentar(er)
