Containers & Blocks:Wireframing Kit for Prototyping in Adobe XD
Containers & Blocks:Wireframing Kit for Prototyping in Adobe XD
When wireframing, there is no reason you should as a designer have to recreate standard containers such as accordions, callouts, and tabs. Its a waste of your time, time that can be spent solving actual design problems.
Continuing my series of converting and recreating my illustrator wireframing assets, this time its containers and blocks. A few of these I use very sparsely or for particular purposes. Accordions and tabs used to be a way to cram and sort lots of content in a small space. While doing so, we are hiding some of that content from the user. Still useful as a space saver, I recommend not using them as an afterthought. They are more suitable for when including associated information, such as shipping terms on a product, etc. That said, accordions are one of my fav ways to display Q&As, making questions easily skimmable and tabs are great for featured tags, filter inline on the page.
Oh, and please check back for more. Enjoy! ヾ^_^
Download Adobe XD Containers & Blocks Kit
Included in this kit
1. Accordion
Vertically stacked list of item with icons indicating if it is collapsed or expanded.
2. Callouts
Callout block, with and without the collapsable icon.
3. Cards
Callout block, with and without the collapsable icon.
4. Time line/Timeline
Timeline with callout blocks.
5. Table
Table with table headers and content.
6. Tabs
Tabs with content.
7. Tooltips
Directional Tooltips.
Enjoy! ヾ^_^
Download Adobe XD Containers & Blocks Kit
More Wireframing Kits for Prototyping in Adobe XD
Want help putting this into practice?
If you want a hand applying this to your product or workflow, we can help you shape the next step.
Start something