Scrolling for CITRIS

Elefint recently had the opportunity to partner with inspiring local organization CITRIS, or the Center for Information Technology Research in the Interest of Society. CITRIS draws upon the brilliant minds and resources at the University of California Berkeley, Davis, Santa Cruz and Merced to create information technology solutions for the most pressing social, environmental, and health care problems. When CITRIS asked Elefint for help creating an impact report to illustrate their amazing work and were completely open to alternative formats for doing so, we got excited about the possibilities. Keeping in mind that this report describes the work and achievements of individuals spread across the state, we decided a simple PDF just wasn’t going to cut it, so we proposed a single-page scrolling site.

The site we came up with uses bright, colorful backgrounds to visually separate the sections of the report, giving the user a sense of place while scrolling without navigation. We also take full advantage of the scrolling format to separate the content into digestible chunks of information and animate certain elements for added impact.

Interestingly, not long after finishing the site we received a piece of direct mail which proclaims that 77% of website visitors don’t scroll down during their initial visit to a website. If this is true, what does this mean for single page scrolling websites and why would anyone ever make such a thing? Well, we took a look at the source of this statistic: a 2006 study of website visitors, or around the same time that infinite scrolling was first introduced but well before we all became so accustomed to its use on sites like Google Images, Facebook, and Twitter and so prevalent on mobile devices.

While outdated, the statistic is not to be totally disregarded. Not everyone will be tempted to scroll, so the key is to make scrolling as enticing as possible. We provided cues within our design to encourage scrolling (a downward pointing arrow on the first few pages) and guide people through the site (color shifts between sections and visible scrollbars to hint at proximity to the bottom of the site). We also provided stopping points where the content was available through hovers or clicks to prevent scrolling fatigue.

All in all, we’re really happy with the way the CITRIS impact report turned out and enjoyed partnering with such an inspiring client. We look forward to taking advantage of the scrolling site format when other opportunities present themselves.




Our site is being re-designed and updated as we speak. Please be patient, while you peruse through our old site.

Got it