LoopNet Design System

As my team of designers in Los Angeles were collaborating with product teams in Washington, DC to iterate on redesigns for the site's core search experience (homepage, search results, listing detail page), it became evident that we needed to grow our design system. We had a process for updating common elements and components, but we were lacking guidance on how and why we make higher level design decisions. We decided to port our shared Sketch library into Invision DSM so we could centralize components and documentation and have them be accessible to developers and stakeholders outside of the design teams. Also, to supplement our updated patterns and components I wrote documentation for our design principles and other top level process guidelines, like which breakpoint widths and viewport heights we design for, which devices/browsers/OSes we test with, and font and padding scales.