XML

Graphic Design Principles - XML

Graphic Design Principles are structured around the four fundamental principles (CRAP: Contrast, Repetition, Alignment, Proximity) systematized in Robin P. Williams' book 'The Non-Designer's Design Book.' These principles are designed to enable people without formal design training to achieve professional visual expression and are applied to all forms of visual communication including web design, UI/UX, print materials, and presentations. Each principle contributes to organizing information, building visual hierarchy, ensuring consistency, and improving readability—transforming chaotic designs into intuitive and effective visual communications.

graphic design CRAP principles design theory UI/UX visual communication Robin Williams design education

<?xml version="1.0" encoding="UTF-8"?>
<items>
  <item>
    <code>01</code>
    <slug>proximity</slug>
    <name>Proximity</name>
    <description>A principle that places related elements close together to visually indicate their relationship.</description>
    <keyPoints>[&quot;Grouping related elements&quot;,&quot;Separation through whitespace&quot;,&quot;Reducing cognitive load&quot;,&quot;Clarifying information hierarchy&quot;]</keyPoints>
  </item>
  <item>
    <code>02</code>
    <slug>alignment</slug>
    <name>Alignment</name>
    <description>A principle that intentionally positions elements to create visual connections and order.</description>
    <keyPoints>[&quot;Building visual connections&quot;,&quot;Left/right/center/justified alignment&quot;,&quot;Unity and order&quot;,&quot;Professional impression&quot;]</keyPoints>
  </item>
  <item>
    <code>03</code>
    <slug>repetition</slug>
    <name>Repetition</name>
    <description>A principle that creates consistency and unity by repeating visual elements throughout the design.</description>
    <keyPoints>[&quot;Establishing brand recognition&quot;,&quot;Creating visual rhythm&quot;,&quot;Improving usability&quot;,&quot;Ensuring consistency&quot;]</keyPoints>
  </item>
  <item>
    <code>04</code>
    <slug>contrast</slug>
    <name>Contrast</name>
    <description>A principle that emphasizes differences between elements to create visual hierarchy and draw attention.</description>
    <keyPoints>[&quot;Building visual hierarchy&quot;,&quot;Enhancing attention&quot;,&quot;Differences in color/size/font&quot;,&quot;Ensuring accessibility&quot;]</keyPoints>
  </item>
</items>