Text messaging scales to fit the space available on the user's device.
The story is navigated by key press and/or touch, depending on the device used.
The fixed, bottom center positioning of the Alliance logo was influenced by its unique shape; it just didn't fit comfortably anywhere at the top of the page.
Design constraints change from one breakpoint to the next: the shape of the logo was not an issue on a narrower screen, allowing the logo to be positioned in the more familiar, top half of the screen. The change in position was done entirely with CSS — no change in HTML markup.
The Health and Wellness Alliance for Children works to improve children’s health and wellness outcomes in the Dallas area. The Alliance needed a microsite to help communicate its mission and provide access to its latest reports and presentations. To help tell their story in a memorable way right up front, I chunked their mission narrative into a series of short statements and sequenced them into an opening-page presentation. In line with the site's responsive design, the story is navigated by key press and/or touch, depending on the user's device.
Art Direction, Visual Design and Layout, Interaction Design, Responsive Design, Front-End Development.
Main logo by Samantha Kowalczyk. Illustrations by David Zacher.