{"product_id":"spark-collection","title":"Spark Collection","description":"\u003cp\u003e\u003cspan\u003e\u003cb\u003e1. Problem Statement\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003eStruggling to maintain the same appearance and logic across different screens? You are not alone: as an interface grows, buttons, headings, fields, and cards often begin to differ without a clear reason. Even small variations in spacing, text size, or component states can make the structure feel disconnected. Without shared rules, each new screen may need to be styled almost from the beginning. Spark Collection explains how to gather key visual decisions into a consistent system and describe how they should be used.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003e\u003cb\u003e2. Solution\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003eThis course will teach you how to create a basic visual system for a group of connected screens. You will examine typography hierarchy, color roles, grids, spacing, and reusable components. The materials explain how to define element variations and document their states without unnecessary duplication. Practical assignments help you review screen consistency and identify departures from selected rules. After completing the course, you will be able to prepare a small component library and a focused document explaining how it should be applied.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003e\u003cb\u003e3. What’s Inside\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 1: Visual System Foundations\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eExamine the purpose of repeated rules and identify which interface elements should remain consistent across a project.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 2: Typography Structure\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eCreate defined levels for headings, body text, labels, and supporting information.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 3: Color Roles and Contrast\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eAssign clear functions to selected colors and examine the readability of central combinations.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 4: Spacing and Layout Rhythm\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eBuild a spacing system and study how repeated rhythm can organize sections and components.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 5: Component Families\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eExamine buttons, fields, cards, messages, and navigation elements together with their main variations.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 6: Component States\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eDescribe default, active, inactive, selected, and error states for key interface elements.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 7: Consistency Review\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eCompare a series of study screens, identify visual differences, and prepare a revision list.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan\u003eModule 8: Mini Style Guide Assignment\u003c\/span\u003e\u003c\/strong\u003e\u003cbr\u003e\u003cspan\u003eCreate a focused collection of rules, component examples, and notes describing their intended use.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003e\u003cb\u003e4. Who Is This For?\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003e✅ \u003c\/span\u003e\u003cstrong\u003e\u003cspan\u003eA good fit if you:\u003c\/span\u003e\u003c\/strong\u003e\u003c\/p\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003ehave created page frameworks and connected screens;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003ewant to organize visual decisions;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003ewould like to treat typography, color, and spacing as one system;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003ewant to create reusable components;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eare prepared to examine details and document selected rules.\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003e\u003cspan\u003e❌ \u003c\/span\u003e\u003cstrong\u003e\u003cspan\u003eNot for you if you:\u003c\/span\u003e\u003c\/strong\u003e\u003c\/p\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003eare not yet familiar with basic interface structure;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eonly want materials about illustration;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003edo not plan to complete screen-comparison exercises;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eexpect a defined employment or commercial outcome.\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003e\u003cspan\u003e\u003cb\u003e5. What You’ll Learn\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cul data-spread=\"false\"\u003e\n\u003cli\u003e\u003cspan\u003ecreate a typography scale with at least five levels;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003edefine the purpose of central interface colors;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003ebuild a consistent spacing system;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eprepare at least six reusable components;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003edescribe states for buttons, fields, and navigation elements;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eidentify visual differences across related screens;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003edocument component usage rules;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003eprepare one focused interface element library;\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan\u003ecreate a short visual guide for a study project.\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003e\u003cspan\u003e\u003cb\u003e6. 30-Day Refund Policy\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003eSpark Collection includes a 30-calendar-day period for submitting a refund request under the Wirelio store rules. The review considers the purchase date, the amount of material already used, and the conditions listed on the refund policy page. Please read the complete policy before placing an order.\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003e\u003cb\u003e7. Certificate\u003c\/b\u003e\u003c\/span\u003e\u003c\/p\u003e\n\u003cp\u003e\u003cspan\u003eA digital Wirelio certificate is issued after all required modules and the final assignment have been completed. It records completion of the Spark Collection course materials.\u003c\/span\u003e\u003c\/p\u003e","brand":"Wirelio","offers":[{"title":"Default Title","offer_id":58181949227340,"sku":null,"price":304.0,"currency_code":"EUR","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/1072\/2125\/4476\/files\/Spark.jpg?v=1784722161","url":"https:\/\/wirelio.org\/products\/spark-collection","provider":"Wirelio","version":"1.0","type":"link"}