When collaborating with our team here at Segue, I still start with paper and a pencil, roughly sketching things out and I probably always will.
I still find that sketching and drawing out your wireframes on paper is always a great way to get ideas flowing, to quickly illustrate those ideas to colleagues and to get things straight in your own head. Sketch is very intuitive and you can create multiple artboards and view what you’re designing all at once - perfect for designing responsive sites!Īt the end of the day, pen, paper or even markers can make excellent wireframing tools. I used Adobe Illustrator for many years but ever since Sketch came out, it has been a designer’s dream tool and our team fell in love with it right away. Tools such as Balsamiq Mockups, Omnigraffle, and Axure are widely used for creating wireframes and have very extensive toolsets and features. If you’re trying to decide which type of wireframing tool to use, there are a wide variety of wireframing tools and apps out there that make wireframing quick and easy. The first step of any good design is to sketch out your ideas and determine the placement of all the different elements on a page. Wireframing for mobile devices first (or from narrow widths outwards) helps us prioritize site elements while putting us in a good mindset for thinking about what content is most relevant to the site visitor and how your content becomes available to work with on wider screens. For years we have spent our time designing fixed width layouts or maximum 960px width in our designs. However, I understand that changing the way we think about these layouts and choosing a new direction can be a little challenging. When planning for a responsive website design, we cannot continue to think through the wireframing process from a desktop only perspective.
The point is to focus on figuring out layout and content placement, and solving navigation and functionality problems in a format that is easy to adjust. Even if clients do not need to see a wireframe, I think it’s still important to create one internally so that designers and developers are all on the same page.Ī wireframe is the skeleton of the page, usually drawn with basic shapes and lines with limited colors and styling. These days, we rarely ever start a design without going through some sort of wireframing process. Responsive design is forcing us to re-think about how we plan out our site designs and how our pages gracefully fit the device they are being viewed on. Designing and developing websites that work across multiple devices is an important part of the work we do on today’s web.
0 kommentar(er)
