My Design Philosophy

Design conveys perspective. It is a robust, accessible language that can be shaped to appropriately suit any context. “To design is much more than simply to assemble, to order, or even to edit; it is to add value and meaning, to illuminate, to simplify, to clarify, to modify, to dignify, to dramatize, to persuade, and perhaps even to amuse.” – Paul Rand, designer

Paul Rand's IBM logo
Famed graphic designer Paul Rand’s iconic IBM logo

As a designer, I am drawn to minimalist systems and works that surface and amplify unique points of view. For instance, I adore Sweedeedee, a Portland, Oregon-based bakery and restaurant. Their craft is simple-yet-sublime: think a poppy-seed cinnamon roll, the cashier pausing to flip a record before capturing your order, an assortment of locally produced ceramic mugs arranged on open shelving.

Sweedeedee
Portland, Oregon’s Sweedeedee

I have had the opportunity to create and evolve various mission-oriented brands, from a multi-million-dollar, community-owned grocery to an educational technology collaborative. Additionally, I have curated various immersive conference and workshop experiences, fabricated goods, and shaped physical and digital spaces. I approach design from a holistic, communication-centered perspective. My process demands that I constantly center the needs of my intended audience or audiences. I aim to create unfussy and genuine companies, campaigns, artifacts, and properties that inspire connection.

One-Page Website Design | Three Exemplars

Well-designed, one-page websites require disciplined and distinctive storytelling. They reject the confines of traditional website design –– which largely mimics print conventions –– and elevate web-native experiences like interactivity and responsiveness. While one-page websites can hobble Search Engine Optimization (SEO) efforts and are arguably ineffective containers for robust and differentiated content, they offer powerful ways to engage viewers in immersive narratives. Let’s take a look a closer look at three exceptional one-page sites.

Pomorilla | An Animated Pizza Site with Pizzaz (Sorry. :/)

An Italian pizza restaurant, Pomorilla celebrates the pie lifecycle (pie-cycle?), from naturally leavened dough to carefully selected ingredients and, finally, the dreamy consumption part. The eatery’s one-page website employs three shapes, each of which corresponds with the form a pizza takes at various milestones in its journey, from raw to cooked. Crust-colored, 1980s-inspired circles, triangles, and squares boogie in the background as a viewer scrolls down the page. Additionally, an overlaid dough-like blob contorts itself as the story unfolds. The property’s warm, four-colored palette, hand-drawn imagery, and patchwork fonts convey a thoughtful wackiness. Like a spirited weirdo, this is the kind of joint you want to get to know.

What’s most striking about Pomorilla’s one-page website design is that it effectively spotlights the brand’s values, character, and offering without the aid of polished food photography. It beckons joyful eaters who appreciate thoughtful, unfussy craft.

Pomorilla One-Page Site
Pomorilla one-page site

Me Too Rising | A Data Visualization and Resource Site

Me Too Rising is a one-page visualization of the global Me Too movement, a social justice campaign dedicated to helping sexual assault survivors heal. Once the site loads, a cream-colored, serif font quote appears on an expansive black background. It reads, “What would happen if one woman told the truth about her life? The world would split open.” Murial Rukeyser’s words slowly fade and reveal a rotating planet Earth, from which animated points of light float toward space; these illuminations correspond with real-time site users. The header includes links to sexual assault resources and social media channels, and the footer displays site traffic trends.

The one-page website’s somber darkness is offset by a choral soundtrack and ember-like animations that evoke momentum and possibility (think: the weight and hope associated with a candlelight vigil). Its imagery is reminiscent of NASA’s galleries, which highlight earthly and space-related phenomena. Me Too Rising’s design effectively accomplishes two things: it demonstrates the movement’s breadth, and it compels viewers to access trauma support. As it does not define the whats and whys of Me Too, the property is intended for survivors already familiar with the campaign.

Me Too Rising One-Page Site
Me Too Rising one-page site

Ueno |  A 3-D-Modeled Interview Microsite

Ueno is a full-service creative agency working on highly visible digital products, brands, and experiences. The firm’s pedigree naturally attracts heaps of talented prospective workers; therefore, to give candidates a taste of the Ueno culture, a one-page, interactive interview property was erected.

As a viewer enters the site, they immediately encounter birds chirping and animated characters inviting the prospect to begin the interview process. Once the viewer consents to the interview, they are greeted by intentionally cheesy video game music and dropped into a brightly colored office-scape dotted with various workers. The only action permitted is clicking on one of the illuminated characters, reminiscent of Lego Minifigures sans legs. Once clicked, the viewer (represented by a hot dog !!!), embarks on a choose-your-own-adventure chat experience with each Ueno employee and eventually the big boss. Once the final chat closes, the viewer is prompted to visit the ‘Careers at Ueno’ page.

The site clearly serves a singular audience: people interested in applying for a job at Ueno. Its design deftly showcases the agency’s creative and technical acumen, as well as the brand’s personality: hilarious, overachieving, and familial.

Ueno One-Page Site
Ueno one-page site
Ueno One-Page Site Chat Feature
Ueno one-page site automated chat feature

Design to Watch

The one-page website is a flexible, multi-sensory storytelling medium that has the power to share well-organized information in imaginative, 21st Century ways. Its impact on website design principles is something to watch. Keep those eyes peeled, creatives.

From Mobile-Friendly to Responsive Design | A User Experience Evolution

The ubiquity and utility of mobile phones and tablets have forever changed website design. When these Wi-Fi connected technologies first emerged, the mobile user experience was crude, at best. Over time, however, ever more sophisticated design practices have been perfected, elevating the mobile user experience to wow status (or so dang fluid, you don’t even consider the design).

Mobile Friendliness

Since 2015, Google’s almighty search ranking algorithm has assigned priority to mobile-friendly websites. Such properties, which are essentially small-scale, largely static replicas of desktop sites, meet the industry minimum for delivering a mobile experience: Users can technically access the site content on a small screen. (To see if your website meets Google’s mobile-friendly standard, check out the technology monolith’s webmaster tool.) However, the ‘friendliness’ of this design wears thin when a user is subjected to miniature font, fails to access or elegantly view multimedia assets, or fumbles interaction with a dropdown menu or form. Enter mobile-optimization.

Google's Guide to Mobile-Friendly Design
Google prioritizes mobile-friendly websites.

Mobile Optimization

As mobile use began to rival, and eventually outpace, desktop use, (check out Tech Crunch’s 2018 statistics) designers began intentionally designing for mobile devices. Optimized design centers touch –– instead of click –– interaction, graphic size reduction for improved site loading time, mobile-unique functionality (think ’swipe right’), and site reformatting that delivers a simplified-yet-cohesive navigational experience.

Typeform mobile design
Typeform optimized its site for mobile use.

Responsive Design

Mobile-optimized design represented the first considered mobile user experiences; however, responsive design now reigns supreme. It’s in the name: Responsive design ensures websites effectively ‘respond’ to screen size, immediately reorganizing content to utilize available real estate. This approach ensures the accessibility of a property’s unabridged content, and it doesn’t force the user to exact awkward-on-small-screen commands, like zooming or scrolling.

Steven Caver responsive website design layouts
A beautiful responsive design, courtesy Steven Caver

Future Thinking

The evolution of mobile design, from friendly to responsive, is an interesting study in how human behavior and preferences dictate experience design parameters. Now that mobile use has eclipsed desktop use, mobile-first design is certain to see its golden age.

On Grid-Based Design | Elegance, Whimsy, and Criminality

Dieter Rams 'Ten Principles of Good Design' Poster
elegant, grid-based design

This poster, designed by British firm Bibliothèque, dynamically employs grid-based design. The graphic summarizes Dieter Rams’ Ten Principles for Good Design and showcases various products created by the iconic industrial designer. The minimalist poster is comprised of large numerical typeface, a sans serif font (with regular and bolded styling) and high-resolution images. The dominant black-and-white palette is punctuated by veins of color, such as the radio’s red channel lines.

While the written copy is conformed to one-column width, the size and orientation of each image differs. In two cases, the photographs are square, while the remaining eight images are precise cutouts with unique dimensions. The lilt of the numerical arrangement –– cascading downward, jutting upward, then progressively descending –– and the surprising, asymmetrical white space create a natural organizational system that offsets the poster’s brutalism. This grid-based design delights both the rational and arational sides of my brain, as it communicates a controlled chaos.

Image of Paria Radikal Landing Page
whimsical, grid-breaking design

Paria Radikal, a self-identified “experimental and progressive” graphic design firm breaks the grid through cacophonous image placement and layering. The site represents the Paria Radikal portfolio, comprised of upside-down numbers and letters, hand-drawn and digital works, artifacts, indiscernible art, and a spectrum of clashing colors set against a black background. They applied a bolded sans serif font (with all caps and lowercase styling).

Overall, the design conveys a wackiness I enjoy. It communicates a frenetic creative urgency that makes me want to become familiar with the designers’ processes, influences, and sources of inspiration. The live site is comprised of GIFs, which convey a randomized Christmas light effect. This playful touch invites the visitor to explore the landing page in its entirety.

Image of Angren.net Landing Page
grid-based design criminality

Arngren is a Norwegian commerce site dedicated to all-terrain and military vehicles, motorized bikes, drones, robots, and science fiction-inspired products. While the landing page utilizes a grid-based design, the absurd combination of haphazardly applied product outlining, myriad background and font colors (the live site includes a Christmas animation), unnecessary product details, and chaotic navigation are panic inducing. The hyperactive layout and accidental palette make me feel as though I am trapped in a toy store moonlighting as a confectionary (get me out of here, please).

The site was neither engineered in concert with human-centered design principles nor visual discipline. Despite the application of grid-based design, the landing page presents far too much information in a uncategorized and dizzying manner.

Affordances, Signifiers, Mapping, and Feedback | A Look at the Alessi 9090

Don Norman, engineer, professor of psychology and cognitive science, and author of the esteemed book The Design of Everyday Things, is considered a human-centered design (HCD) thought leader. He believes engineers and designers must abstain from making assumptions and instead observe and understand how humans interact with the world (e.g. a particular object or system) before they imagine, prototype, and test solutions.

Getting the specification of the thing to be defined is one of the most difficult parts of the design, so much so that the HCD principle is to avoid specifying the problem as long as possible but instead to iterate upon repeated approximations. –– Don Norman

Alessi 9090 stovetop espresso coffee maker
Alessi 9090 Espresso Coffee Maker (Creative Commons)

In The Design of Everyday Things, Norman spotlights the importance of discoverability. Effective design encourages and allows humans to easily discover how an artifact is used. Careful attention to four principles of interaction –– affordances, signifiers, mapping, and feedback –– lead to competent, translatable design. To better understand the facets of these principles, I assessed how the Museum of Modern Art-inducted Alessi 9090 stovetop espresso coffee maker (pictured right) stands up against Norman’s definitions.

Affordances

An affordance describes the relationship between a physical object and an agent of interaction, be they human, animal, machine, or robot.

An affordance is a relationship between the properties of an object and the capabilities of the agent that determine just how the object could
possibly be used. A chair affords (“is for”) support and, therefore, affords sitting. –– Don Norman

The Alessi 9090, comprised of three separate components –– the base, the basket, and the vessel –– affords liquid storage, heat conduction, percolation, and liquid pouring. Additionally, it affords assembly and disassembly.

Signifiers

A signifier amplifies usage by indicating where and how a particular interaction should occur.

Affordances determine what actions are possible. Signifiers communicate where the action should take place. –– Don Norman (emphasis mine)

The Alessi 9090 boasts various signifiers, not all of which are effective.

  • The hollow base includes a screw that can be seen from the outside and inside of the product. To avoid overfilling the base, one must fill it with water to the bottom of the screw and no fuller. I cannot remember how I learned this fact, whether it was knowledge conveyed by a salesperson or contained in a manual. To me, however, it is not intuitive. Norman believes simple appliances should not require written instructions; their uses and functionalities should be readily understood. By that standard, the Alessi 9090 trips up where the screw-as-water-line is concerned.
  • The basket, which holds ground espresso beans, sits perfectly atop the base. There is no other way to arrange the basket (hooray!).
  • The vessel contains a handle fixed by a hinge at the top and loose at the bottom. The spout side of the vessel includes a cutout that neatly fits around a small piece of metal on the base. The handle is hollow and its bottom securely clicks onto a handle-side piece of metal on the base. These signifiers are brilliant. A human can quickly deduce how to secure the vessel to the base.
  • The lid includes two signifiers: a triangular spout and a metal tab that encourages pushing. The former tells a person how to situate the coffee maker to nonviolently pour the coffee, and the latter encourages the agent to push the tab to see if the coffee is done and the machine is working properly. Once a finger is released from the tab, the lid closes via gravity.

Mapping

Mapping aids a human in understanding how controls work, meaning what they control and how they can be manipulated to influence different outcomes.

Mapping is an important concept in the design and layout of controls and displays. When the mapping uses spatial correspondence between the layout of the controls and the devices being controlled, it is easy to determine how to use them. –– Don Norman

The Alessi 9090 maps metal tabs on either side of the base to indicate how the spout-side and handle-side of the vessel should be secured to the base.

Feedback

Feedback tells a human that a particular process is working and, optimally, indicates the process stage. For instance, when one takes an online survey, they often see a progress bar that showcases what they have done and how much more they have to accomplish before the activity is completed.

Feedback [communicates] the result of an action. –– Don Norman

The Alessi 9090 provides feedback in two prominent ways.

  • When the vessel is clipped into the base on both the spout and handle sides, a distinctive click can be heard. This tells an agent the coffee maker is secured and ready to use.
  • As percolation occurs and coffee fills the vessel, one can hear a bubbling noise which indicates the coffee is brewing. Once the bubbling noise ceases, one knows the coffee maker should be removed from heat and the coffee consumed.

The four principles of interaction provide a framework for engineers, designers, and makers of all variety to build humane designs that center the organic behaviors and needs of their intended audiences. Up with Norman! Up with empathetic design!

 

 

Blogging’s Role in Online Culture

Evaluating the blog’s role in modern online culture is an interesting exercise. My early interactions with blogs were initiated through organic search (think “how to make Marcella Hazan’s genius tomato sauce”): I would encounter them as I sought answers to specific questions. However, my frequent internet inquiries eventually revealed preferred authors and content outlets. I subscribed to various blogs, like this one dedicated to whole foods cooking, and incorporated reading posts into my morning ritual. I fell in love with writers’ unique voices, expertise, and use of the medium.

While blogging is evolving to complement newer social channels by offering evermore niche content in visually compelling ways, one attribute of the storytelling platform has remained constant: a well-constructed blog urges the reader to develop a multidimensional relationship with a writer or writers. Blogs offer practical, inspiring, and evocative information with emotional generosity, differentiating them from online forums that encourage superficiality. Even a blog about design, when thoughtfully curated, can deepen human connection –– an important act in today’s fragmented world.