The most efficient way to build accessible websites and apps is to “shift left” by incorporating accessibility testing into the earliest stages of your development and design process. In this article, Harris Schneiderman will walk you through the process of analyzing a wireframe from an accessibility perspective and making coding decisions to optimize for accessibility in both design and development phases.
Read more…
Today, as designers, we are lucky as never before because there are dozens of tools available for us to design wireframes and also smoothly integrate this activity in our general design process. In this article, Anton Suprunenko will take a deeper look at one of the most simple yet quite often underrated activities in web development: the design of wireframes. You’ll learn what wireframes are, why we need to design them, how to get the most out of the designs, and how to take it to the next level.
Read more…
Over the summer, Adobe XD released two great prototyping features: fixed elements and overlays. When you work with prototypes and want them to be more interactive, functions like these will be very helpful. In this article, Manuela Langella will show you how to set a menu bar as a fixed element and how to apply an overlay transition in a prototype, to simulate a menu opening from the click of a button. She’ll also include an Illustrator file with icons, which you can use to set up your examples quickly. Let’s get started!
Read more…
A wireframe is a visual representation of your project’s structure. It defines the bones, the elements that will work in your layout, and the placement of the content for your prototype. Working with wireframes allows you to get creative without worrying too much about the style or the design of your project. In this tutorial, Manuela Langella will teach you how to create a landing page for an online course website, and offers a mobile wireframe you can use to practice and follow along.
Read more…
The best design follows an iterative process. The earlier in the process you can identify and fix problems, the easier and the less expensive it is. This is where prototyping comes in. Techniques such as wireframing and prototyping have transformed how user experience designers work nowadays. In this article, Christopher Murphy will take a closer look at the benefits and the process.
Read more…
Generally speaking, writing a requirements document is mostly about conveying your vision to the rest of the team. In this article, Eduard Khorkov will outline the most common approaches to writing requirements documents. You will learn the basic steps of writing mobile application requirements and what a good requirements document looks like. Eduard will create two documents: a PDF with user stories and wireframes, and a screen map that complements the PDF. Together, they describe in detail what features the application should have.
Read more…
How exactly does one make a “good” app icon? A beautiful, identifiable and memorable app icon can have a huge impact on the popularity and success of the app. In this article, Michael Flarup has put together some tips and advice to guide you on your way to designing great app icons. He’s been designing, making resources and giving talks about icon design for the past couple of years. In this article, and in the video at the end, he’ll sum up what he’s learned about this amazing craft.
Read more…
In this article, Kyle Cassidy shares his thoughts and experiences on how lean thinking helped to instill efficiencies within his UX design process. For clients undertaking multiple projects, the lack of consistent wireframe deliverables was confusing and disorientating, with the client having to remember multiple URLs and logins while also learning how to navigate the various outputs. Many routine tasks were unnecessarily repeated across multiple projects. It was clear that they needed to establish some rules and guidelines to create a more cohesive approach. They needed to set a new direction, and now was the time to start.
Read more…
In order to improve your workflow, in this article Edric Lapniramai provides a checklist to refer throughout the UX designer’s wireframing process. Divided in three sections — decisions to consider before wireframing, detailing the design elements, and annotations —, this guideline can help you perfect your wireframes and be practical with your time.
Read more…
How do you go about designing an app? Michael Flarup brings you an article about just that. A top level, somewhat simplified, and very honest overview of the steps involved in designing an app. This is an account of how most of the apps I work on are born, complete with shameless links to the tools he uses. Now when people think of ‘designing’ something, their thoughts often circle around the visual aspects of a product. Pixel pushing in Photoshop or laying grids in Sketch, but that’s a common misconception. Design, in the context of this article, covers the entire process. It is every deliberate action meant to produce something. The truth is that from the moment you get an idea, you are designing.
Read more…
