{"id":15380,"date":"2017-03-27T08:00:28","date_gmt":"2017-03-27T15:00:28","guid":{"rendered":"https:\/\/www.uxpin.com\/studio\/?p=15380"},"modified":"2026-05-08T02:18:13","modified_gmt":"2026-05-08T09:18:13","slug":"take-advantage-complex-pre-built-elements-design-systems","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/take-advantage-complex-pre-built-elements-design-systems\/","title":{"rendered":"Take Advantage of Complex, Pre-built Elements in Design Systems"},"content":{"rendered":"

What resources do designers and developers need to keep a project on track, consistent, and easy to edit? <\/p>\n

The answer lies in their team’s design system, which often includes practical, relevant examples of items used in design. They go under many names: components, widgets, elements, molecules \u2026. Regardless of their names, the items that go into a design system solve several problems.<\/p>\n

Easy to reference:<\/strong> Design systems make items easy to find in a hurry, whether by search or category or other criteria. To do so, the items’ names and metadata must be accurate and up-to-date.<\/p>\n

Easy to apply:<\/strong> Ideally, items in design systems would contain the files, like PSDs, that designers can copy and repurpose for their immediate needs.<\/p>\n

How complete should design system elements be?<\/h2>\n

From lo- to hi-fi, items in design systems should reflect the team’s workflow. If they need boilerplate information, then blank templates comprised of grey boxes should do the trick. If the team needs more pracitcal examples to answer, “how did we use this six months ago?” then high-fidelity items with real (or realistic) content is more appropriate.<\/p>\n

For example, UXPin has basic shapes like boxes, arrows, and circles \u2014 standard design stuff. But it also has some built-out sets you can use as starting points for your work. For teams building apps, Adalo<\/a>‘s no-code approach similarly offers pre-built components that accelerate the design and development process, allowing you to focus on customization rather than starting from scratch.<\/p>\n

\"Many<\/p>\n

Design system components should be fully editable, right down to the text and colors. And some are more customizable than others<\/a>. They should also be easily findable<\/a>. For example, searching UXPin for certain keywords will produce many results:<\/p>\n