Inventing a more humane way to scroll.

I consider feeds to be the “operating systems” of this generation — hubs for almost everything the average person will do on a computer.

For many people, especially those with limited attention spans and/or executive function capabilities, a break from the need to constantly be weighing decisions (Where do I go? What do I do?) feels especially welcome. I don’t need a reason to pick up my phone because I know I’ll find a reason the instant my screen turns on. I don’t need to think, I don’t need to decide— all I have to do is scroll.

It’s kind of wonderful… in theory.

The luxury of not having to make any decisions is also a curse. Because decision making is intentionally left out of the typical social feed experience (…at least for now), we have very little control over what goes into our feeds other than the people we choose to follow (or friend). And even then, we are still at the mercy of the all-mighty algorithms that are constantly trying to predict what (ads) we might want to see next.

And so, even though we live so much of our lives on feeds now, it often feels like the feeds are the ones feeding on us. We know now that the unregulated use of persuasive technology in the context of social media feeds has helped usher in an age of addiction, surveillance capitalism, techno-fascism, and (newly emboldened movements of) white supremacy. Given everything that’s happened, it’s no surprise that the feed now carries a somewhat negative connotation — evoking images of gluttonous consumption and, to some, a lack of discipline.

“The best minds of my generation are thinking about how to make people click ads” — Jeffrey Hammerbacher

Despite all of social media’s sins, I am against “ScreenTime” style interventions. Asking people to abstain from social media works about as well as asking teenagers to abstain from sex — it’s just not going to happen, and it places the responsibility (and shame!) on the wrong folks.

Instead, I’m interested in looking at interventions that take place at the paradigm level. There’s obviously something about feeds that human beings are drawn to… what if we could reinvent the feed as a place that makes space for human intent and self-fulfillment, without losing the mechanisms that make Feeds special in the first place?

Early Concepts

At some point in the past year, I came to the realization that Mercury OS, the speculative operating systems prototype I released in 2019, boiled down to intelligently assembled feeds of modular interfaces. Sensing an opportunity, I modified the concept into something more realistic — a to-do list application that generates a feed of interactive modules based on your tasks.

However, after a few months of prototyping, I came to realize that a feed filled only with the promise of “more work” is a feed I will never return to. It’s the same reason why todo lists never worked for me — I have no interest in looking at a list consisting only of things I don’t want to do. (If I wanted to do something, I would have done it already so it wouldn’t be on the bloody list!)

There was something missing. A sense of reward. A dopamine hit. A —

And that’s when it hit me.

Social media feeds like Twitter are explicitly designed to give people feelings of reward and accomplishment. What if, instead of creating a brand new feed to be productive in, we simply brought productive moments… into social feeds?

Enter Hijack Your Feed.

Introducing Hijack Your Feed

A project in collaboration with Omar Rizwan and Jeff Dlouhy

Hijack Your Feed is a browser extension that replaces ads in your Twitter feed with tasks from your Reminders, rendered as visually striking, interactive posts.

It runs on Safari and synchronizes with the Reminders App that comes preinstalled with every Mac.

Unlike my earlier concepts, Hijack Your Feed (in Omar’s words) “seamlessly fits into the way you already work — the Twitter feed you already scroll through, the Reminders app you already use — rather than requiring you to adopt a new habit.”

A hijacked post that catches your eye could serve as a moment of inspiration to jumpstart a project, a gentle nudge towards chores you may be avoiding, or a simple reminder to buy more cat food.

This collaboration with @jasonyuandesign and @rsnous grew out of an idea of how to get your to-do list to force you into doing tasks. This lead to thinking about ways of using tactics that social media companies use to steal your time and attention and use those to get it back.

Be your own influencer

You don’t need any design or development skills to create hijacked posts — Hijack Your Feed automatically generates them based on a wide variety of preconfigured styles.

We wanted hijacked posts to feel almost like ads that you’re intentionally “selling” to yourself, and even designed them to be deliberately distracting in the same ways that real ads would be.

Many of the styles we included are interactive — we wanted hijacked posts to feel playful, and for users to have fun fidgeting with them.

Inspired by their real ad counterparts, Hijacked posts also come with “CTA’s” (Calls to Action). Unlike real ads however, Hijacked CTAs will not link you to sketchy websites selling knock-off Naruto merchandise. Instead, clicking on a Hijacked CTA will remove the task from your feed, while also marking it as complete in your Reminders App without the need for a manual context switch.

When @jasonyuandesign showed me this I instantly loved the concept-injecting a serendipitous channel with fun and punchy reminders of what's on your to-do list. Hey, this is why ads work so well on social media. Why not reminders as well? https://t.co/7jMrPmcrrW

Scaling the Speculative

The version of Hijack Your Feed that we dropped represents a single thread in an entire tapestry of ideas that we’re excited to explore.

What other kinds of interesting interactive experiences outside of ticking off tasks can we hijack into a feed?

One lightweight and playful example that we toyed around with is a “doomscroll countdown clock” that ticks as you scroll through your feed and keeps track of how long you’ve been on Twitter. It acts as a playful “Call to Action” to “save yourself” by exiting Twitter and doing something else with your time (if you so desire). It’s like an emergency escape hatch — for when you don’t *want* to be distracted by Twitter but find yourself scrolling through Twitter anyway.

Are there experiences that might feel more ergonomic within the unique context of a feed? Tasks like… replying to spare emails, perhaps?

What about experiences that aren’t “productivity” centric? In what ways can we play to or subvert the expectations of interactions that can exist in a feed?

I love the move this project makes of injecting new nouns and verbs into pre-existing habits and environments. A new kind of controllable peripheral vision.I'm not very task-ish, so this makes me wonder: what else might I want to throw in these slots? e.g. favorite art/poetry? https://t.co/SIIBUykeoV

(Just for fun) Is there a world where multiple feeds can coexist at once? A choose-your-own-adventure style feed where you can scroll into and out of diverging paths?

And finally, it should go without saying that we’re already thinking about ways to Hijack other feeds in interesting ways…

…as well as how Hijack Your Feed could one day scale into Hijack Everything.

like, let's admit there's something about the feed as an interface that works & that we should learn from & build on

Learn more about Hijack Your Feed

Download on the App Store. We’d love to hear what you think!

— Jason, Omar, and Jeff

Hijack your feed was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

The first question I ask when meeting other designers is how they would define design. Some have asserted that there are no wrong answers to this question. They are wrong.

Here are three examples of what design is not:

1. “Design is making something beautiful”
2. “Design is making something easy to use.”
3. “Design is making something beautiful and easy to use.”

Some of you may find this confusing. Because according to the wisdom of Twitter’s top design influencers, design is form and function — how it looks and how it works, right?

But..

Why?

Why have we defined beauty and ease of use as the non-negotiable North Stars of design? When was the last time we’ve stopped to ask ourselves, “does the product I am working on deserve to be beautiful? Does the feature my PM wants to ship deserve to be intuitive and easy to use?”

Sharing an article on Facebook is super easy — lighty tap the tip of the juicy share button to spray your followers’ News Feeds with some yummy content.

But does such an action deserve to be so easy?

By making Sharing a tap or two away, have we also diluted the gravity of that action? Sharing something in the real world in front of a group of people demands conviction and bravery; we share when we believe in what we have to say so much that we are willing to risk potential humiliation and ridicule. And as someone who was trained as an actor, I can tell you that it is never easy, no matter how it may look.

Just like how we hold Facebook’s content policies accountable for igniting the spread of misinformation, so too must we examine the paradigms and systems that afforded the spreading in the first place.

So, what if sharing was not so easy?

What if Facebook required everyone to open links before they share them?
What if users were only able to share one external link per day?

Limiting the amount/frequency of shares may add weight back to the action of Sharing, encourage users to be more thoughtful of what they share online, and improve the quality of content available on Facebook as a whole. It will add a sense of accountability to the action of sharing, and healthy communities cannot exist without accountability.

Yes, adding friction to the sharing experience would have a significant impact on Facebook’s bottom line — after all, unlimited one-click shares equal exponential exposure for advertising partners. But if Facebook really wants us to believe that its North Star lies in Connecting People, such sacrifices may be necessary.

Another example of something that was designed to make things “easy” is the infinite scroll invented by Aza Raskin. On paper, it sounds benign — and yet, the ease of use that the infinite scroll affords has been hijacked by designers at social media corporations to instead keep people in an endless machine state dedicated to consumption and ‘engagement’. What was originally intended to deliver power to people by reducing interstitial friction is instead being used to siphon agency and power away from people.

Maybe it’s time reintroduce friction in the browsing experience.
What if people were asked how much time they have to browse Instagram every time they launched the Application?

Even better, if this feature could talk to services like Lyft to generate a flow of content appropriate for the user’s context without burdening the user with setting expectations?

Instagram could then generate a curated flow of content with a hard stopping point, optimized to keep people engaged within their personally defined boundaries, politely stepping away once the user has achieved their intention.

Under this paradigm, users would become more aware of their relationship with technology and make necessary adjustments should they see fit. This could also act as a great intermediary step between two extremes (browsing infinitely vs. deleting your account).

You’re probably thinking about how no PM at Facebook would ever approve the hypothetical solutions outlined above. And who would blame them? Their performance and end of year bonuses are tied to quantifiable increases in click-rate. Plus, deliberate frictions in the experience will undoubtedly lose against solutions prioritizing ease of use when it comes to things like AB testing. Quantitive user research is often misinterpreted as “ruthlessly optimize for engagement” with little wiggle room for humanizing the experience. To quote a friend and fellow designer Davina Kim, “Why bother asking users how they feel about a design if ultimately you just ship what moves the needle?”

Just like empathy, great design cannot be quantified nor measured through engagement metrics. Great design is about empowering people to achieve their goals, not about manipulating people into doing what you want them to do. Being persuaded or manipulated into pressing a button is not the same thing as wanting to achieve something that requires pressing the button.

Design is political — a way of affecting human beings’ relationship with power. A way of controlling the flow of power through society. An opportunity to reinforce or dismantle through thoughtful invention.

It is also a form of colonialism; a select group of people making decisions on behalf of a larger population, often forcing those decisions because they are supposedly “better” or “more delightful” is — at its core — colonialist.

As designers, our job is more than just optimizing for visual elegance and/or ease of use. We must critically reflect on the role that we play in the world, to consider if what we are building is what the world needs, and to advocate on behalf of those who hold less power.

This might mean taking initiative and presenting a vision of a North Star we believe in. It might mean firmly pushing back on attempts to ship dark patterns. It might mean speaking up against an ordinance from higher ups that we perceive to be harmful to the world. It might mean making noise when capitalism prefers the comfort of silence. It might mean making space for the light of marginalized communities to shine through. And sometimes, it might mean walking away.

As long as designers continue to hold this power, designers also need to also be the ones held accountable for its misuse (intentional or not). Asking people why they don’t just delete their account points the finger at the user instead of the people who allowed for the exploitation to occur — especially when so many of our inventions were engineered to be as addictive as possible.

And as long as the world continues to adapt itself to the things we are making, designers will continue to shoulder the responsibility of power.

Whatever it is, it is not easy. But that doesn’t mean it should be.

Jason Yuan

Human Interface Designer

Creator of Mercury OS

Twitter | Instagram | Website | Email

The fallacy of easy was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

Nine months ago, I set out to invent a new way of interfacing with our devices, armed with only a single metaphor: Mercury.

Mercury, the elemental manifestation of fluid chrome.
Mercury, the Roman deity bridging the boundary between two worlds.
Mercury, the nearest planet to the sun.

Although these versions of Mercury had little to do with interaction design, they perfectly summarized how I wanted the experience of computation to feel. I wanted the experience to feel fluid. I wanted to create something that users could move through without friction or boundaries. I wanted to bring people closer to their North Stars with speed and elegance.

In the months that followed, I devoured countless volumes of HCI literature while pivoting from one prototype to the next. I tried everything from a “smart-fidget-ring” concept that doubled as a universal remote, to wondering if something as simple as a rubber-band could serve as an interface. Although I was surprised that something so illogical could inspire so many avenues for exploration, nothing seemed to capture the feeling I had described in my poetic manifesto.

My breakthrough came when I realized that I had been asking all the wrong questions. I had spent months trying to invent new ways to navigate existing systems — but what if those systems were fundamentally flawed? What if the experience of Mercury required a radical re-invention of everything I had been taking for granted?

Why?

In my article titled “The Desktop Metaphor Must Die,” I described some fundamental issues with the Desktop metaphor and App Sandboxes. My personal investment in the future of computation goes much deeper than simply craving a better experience for experience’s sake.

Mercury is designed, first and foremost, to be an experience inclusive of people with limited executive function and cognitive load. People living with ASD, ADHD, and other neurological differences who are frequently overwhelmed by the flood of sensory information we have all come to expect in conventional operating systems.

People like me.

Research has shown that people with limited executive function find it more difficult to get things done when they are not in flow-state. We are also more susceptible to interruptions and interstitial friction. These interruptions include everything from the obvious (Notifications, Alerts, etc) to the not-so-obvious (Photoshop asking you to name your file AND choose where it will be saved). It is truly unfortunate that friction has come to be accepted as an unavoidable part of everyday computing.

For people who already have trouble controlling their locus of attention, the context switching required to deal with these interruptions can be an incredibly draining experience that could take up to 15 minutes. For comparison’s sake, the average neurotypical person is usually able to switch gears in under 10 seconds.

This is why the inherent modality of Applications and Windowing environments is particularly frustrating to me. And while I understand that for some people, the desktop metaphor is not broken enough to require any fixing (where’s the data?, they ask), I stand by my words and my truth.

On that note, let’s dive into what Mercury actually is.

Mercury is…

1. Fluid

Instead of asking people to modify their thoughts and actions around the arbitrary sandboxes of Apps, Mercury responds fluidly to the intentions of its user, alleviating the risk of interstitial friction that all multi-tool workflows carry.

2. Focused

The clutter we take for granted in today’s operating systems can be overwhelming, especially for folks sensitive to stimulation. Mercury is respectful of limited bandwidths and attention spans, and rejects the idea of “notification driven engagement.” Information will not be pushed to the user unless they intentionally ask for it. Mercury’s intention-as-context architecture vaccinates the user against the unintentional consumption of information.

3. Familiar

Mercury introduces new ideas and metaphors through familiar interaction patterns on an existing device: Mercury is designed for multi-touch tablets with keyboard support — a category often overlooked as awkward hybrids straddling two worlds. Mercury leans into the playfulness afforded by multi-touch and the efficiency made possible by the keyboard.

Mercury re-imagines the operating system as a fluid experience driven by human intent.

This is Mercury.

Architecture

On the atomic level, Mercury is comprised of Modules. Modules are combinations of content and actions assembled based on user intent.

Users can create new modules that live adjacent to the starting module. A horizontal row of Modules is called a Flow. This is true even if there is only one module in the entire row.

A Space is a contextual grouping of the different flows required to fulfill an overarching intent. For example, if a user declares a “Review Inbox” space, Mercury will populate it automatically with flows containing the unread messages that the user will need to read in order to fulfill their intention of reviewing their Inbox.

A Space is generated every time a user declares an intention from the empty state, and is generally named after said intention. Almost every interaction in Mercury takes place within a Space.

Modules

Modules are the building blocks of Mercury. They are defined using combinations of nouns (items), verbs (actions) and modifiers.

Modules generated by the system employ a Noun-Verb construction because it is assumed that the content of the module will dictate the actions the user will intend to take (if any).

User-defined Modules can certainly follow the Noun-Verb model described above. However, Verb-Noun construction is also supported so that users can ask for Modules colloquially. This use case will be especially common when Voice input is used.

Note that Mercury will not produce a Module from a definition that does not specify a Noun (e.g. “Play…”). Instead, it will suggest different nouns to complete the definition.

The Power of Locus

Users can redefine Modules at any time using its Locus (the action bar). Locus combines the power of a Command-Line Interface with the convenience of Natural Language Processing and the discoverability of GUI.

Locus recognizes complete sentences as Actions, and can even perform tasks that involve multiple steps. Just activate the Locus by tapping on it, or by toggling the Command key. As you type, Locus will offer context-specific suggestions to help you discover its capabilities.

Standardized Shortcuts

In conventional operating systems, keyboard shortcuts are hard to remember and a nuisance to find. Furthermore, different Apps may require different shortcuts for the same function.

In Mercury, shortcuts are standardized through Locus. To see which ones are available, simply press and hold the Command key. Without letting go of Command, start typing to progressively filter the list of actions down to the one you want.

Responsive Modules

Contextual modifiers (like conditional statements) can help automate more nuanced tasks on demand, without the need to leave the current context.

Simultaneous Modules

Modules are able to exist in multiple Flows and Spaces simultaneously if the user chooses to create Mirrors. Mirroring is fundamental to the architecture of Mercury, as it ensures that all items and actions are immediately reachable regardless of what Space (or context) the user is currently in. For example, mirrors of an email from your professor can exist in your Inbox Space and your Coursework Space at the same time.

Flows

In conventional App-driven operating systems, functions are segregated within different Apps. The process of moving from App to App generates friction that takes you out of flow, and distracts you from your intentions.

Mercury is designed to help you enter and stay in flow. If you want to perform an action while leaving your current module untouched, you can generate a new module by tapping the Plus bubble adjacent to your current module, or by pressing the Tab key on your keyboard.

You can also use continuous gestural input to generate Modules without diverting your attention from the content you’re engaged in. Simply highlight a chunk of text to get started. An empty Module containing contextual suggestions will greet you where your finger left off so that you can keep the momentum going.

Spaces

Everything you do in Mercury is organized within Spaces. Spaces can be created from scratch, built on top of a Blueprint (template Spaces for common contexts and workflows), or generated for you by Mercury.

A swipe up from the home screen reveals your chronological journey through time and, ahem, Space. Can’t remember what you worked on last Thursday? Just find it in the Timeline. Want to reflect on the amount of time you spent Tweeting about Game of Thrones this weekend? To the Timeline we go.

Entering a Space from the Timeline feels like zooming into a different dimension. The interface fades into the distance so you can focus on getting into flow. While inside a Space, you will receive no notifications unless you intentionally specify your availability in the Rules of the Space. Nothing stands in between you and your intentions.

Within a Space, flows represent the necessary steps that need to be taken in order to accomplish the intention of the Space. The “Review Inbox” intention, for example, includes all unread mail messages as well as incoming direct messages aggregated from different, unrelated services. In a conventional OS, one would have had to open multiple browser tabs or Applications in order to accomplish the same intention of “Review Inbox.”

By isolating services from their wider ecosystems, Mercury helps prevent potential avenues for distraction and unintentional content consumption.

Your Space, Your Rules

The pinch gesture reveals a birds-eye view of every module inside the space, as well as the rules and collaborators that define how the space is generated.

Artificial Collaborators

In a speculative future without Apps, corporations can continue to offer services through AI assistants. Adding these assistants into a spaces will add service-specific funtionality to the Modules in that space. For example, you may enlist the help of several Virtual Shopping Assistants on your quest to find the perfect pair of kicks.

You can ask Collaborators to generate modules automatically, or restrict their activity based on context. Collaborators will not have access to any information outside of the modules directly affected by their input. The sandboxing of Collaborators within Spaces protects your privacy while preserving intentional access to services you may rely on.

Get Together

Plan a trip to Vegas. Watch BLACKPINK’s comeback with your fandom. Share documents, images, and work collaboratively in real time by inviting others to join one of your Spaces.

Art Direction

Mercury’s visual identity fuses the rational structures of Western Modernist design with the East Asian instinct to seek tranquility in chaos.

Fog

Kiri (霧), Japanese for “fog,” is the name of Mercury’s visual manifestation. Kiri takes a judicious approach to contrast — bringing clarity only where it is needed, while obfuscating extraneous noise under a soft mist.

Choreography

Motion is used throughout Mercury to maintain spatial consistency and to guide the user’s locus of attention from one module to the next. Mercury’s choreography was inspired by the Daoist Way of inexertion; the interface moves without resistance to human input before easing into the equilibrium of stillness.

Typography

Mercury emphasizes contrast in type size to reinforce information hierarchy and spatial consistency. The world of Mercury is set exclusively in Söhne by Klim Type Foundry, a type family exuding elegance and softness, while remaining uncompromising on clarity.

Where there’s light…

Kiri retreats into the shadows when night falls. Modules are backlit with a sublime incandesence inspired by the ethereal glow of moonlight.

What‘s Next?

The one thing that has become blindingly clear to me throughout this nine month process is how absurdly foolish I was in believing I could go about doing this alone. This particular line of inquiry is so ambiguous, so reliant on abstract ideas and metaphors that I found myself digging rabbit holes for weeks and weeks only to lose my way in their murky depths.

In fact, almost all of the defining moments of Mercury have been a product of inviting the brilliance of others into my isolation chamber for feedback or collaboration. The feeling of bouncing ideas off exponential collaborators and working towards a shared North Star is addictive; all I can think about is how much I want to do this for the rest of my life.

And that is exactly what I intend to do.

I will be graduating from my BFA program at RISD in under a week, and my current plan is to travel to the West Coast in search of exponential collaborators and cybernetic thinkers who are also passionate about exploring this domaine. And if I can’t find a team, I intend on building one.

There are so many questions I still need to answer, so many ambiguities I need to explore, and so many loopholes I need to reexamine. Universal undo/redo is so needed, yet strangely absent in almost all operating systems today (Shake to undo is not a viable replacement).

And what about screens as a whole? Is the future of computation really just sliding fingers around slabs of glass?

Instead of trying to resist the crushing gravity of curiosity, I am choosing to commit myself to a life time of cybernetic thinking, question-asking, and trouble-making. Hopefully, I won’t be alone.

So, what’s next? I have no clue.

All I know is that I must keep going.

Your’s truly,

Jason Yuan

Humane Interface Designer and Advocate

Creator of Mercury OS

Twitter | Instagram | Website | Email

Acknowledgements

Mercury would not have been possible without the generous feedback and encouragement from my wonderful peers, mentors, and friends.

My most heartfelt thank you’s to Danny Trinh, Phill Ryu, Thomas Buffet, Mark Laughlin, Dandan Luo, Katie McIntyre, Jonathan Lee, Bob Burrough, Ed Kim, Marc Reisen, Ja Yoon Lee, Advait Kalakkad, Evan Rodgers, Gabby Widjaja, Cameron Burgess, Sharon Wei, Laurent Del Rey, Newar Choukeir, Victoria Wang, Aiden Fisher, Alex Schneidman, Devin Fan, Mac Wang, Eliza Chen, Sumaia Masoom, Theia Flynn, James Goggin, Sofia Soto, Evelyn Ma, Jennifer Joung, Vivian Wang, Lucas Ochoa, Kristina Selinski, SueSan Chen, and Gray Crawford.

Special thanks to:
Marisa Lu for bringing brilliance to the darkest tunnels of this journey,
Jodi Leo for keeping me afloat and for making the world feel less alone,
Paul Soulellis for your guidance and unwavering faith,
Lindsey Weiss for your profound insights and for siblinghood,
Kris Sowersby for trusting me with bringing your characters to life.
Pam Daniels and Brandon Williams for introducing me to the world of design,
David Catlin and TBD for the gift of storytelling and the strength to speak up,

And to Dennis Jin for being the epitome of an exponential collaborator.
For helping shoulder the weight of Mercury, for your technical expertise, and for all the hours you poured into this. Truly incredible.

And thank you, dear reader, for participating in this conversation and for making it this far. Thank you for your curiosity.

Introducing Mercury OS was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

Amidst an unstable childhood, my Desktop was my retreat — a place I could find solace and belonging. The Start button was a gateway to opportunity and each Folder a comfortable if imperfect container for my belongings. No matter how overwhelming the outside world became, I knew that my Desktop would stay the same.

Years passed. Social media exploded, and the three years and ten thousand kilometers separating a teenager and his childhood dissolved with a click. My world was changing, but my Desktop stayed the same.

Years passed. And passed. And passed. As technology accelerated, so did society’s demands on our collective bandwidths. The smartphone boom led to an avalanche of Apps. Notifications multiplied pathogenically, and the corporations behind them soon learned to tug on my vulnerabilities — Engage! Now, before it’s too late!

It all became too much, too fast. To quote a dear friend of mine, human beings simply aren’t equipped with the necessary bandwidth to process the explosion of information that our world has normalized.

To make things worse, it turns out that the desktop metaphor underlying so much of our computing was not equipped to handle it either. In response to the increased stimuli, our Desktops simply started generating more clutter. Windows upon windows of tabs and tabs, folders within folders of Untitled(1). Never-ending, nebulous clutter.

This is because the Desktop was originally designed in 1973 to suit a very different need in computation—the need to mirror digital content with its physical equivalent (WYSIWYG, anyone?). But in a post-Internet world (at the cusp of 5G and the AI singularity, I might add), the way we consume and produce content has largely moved away from the baggage of physicality. It also doesn’t help that the Desktop has stayed the same for almost 50 years.

Sure, recent iterations of the Desktop metaphor have introduced tools and prosthetics that have helped to extend the capabilities of our computers—virtual desktops and file stacks are two great examples of this. But in the end, they are all just crude workarounds—band-aids on a rotting wound.

And when we strip away all the chrome—all the Aero and Paper and Frosted Glass, all the evidence of the “design systems” we have poured billions into developing and maintaining—we come face to face with a skeleton of XEROX PARC’s 1973 invention.

The Desktop Metaphor is Inhumane

20 years ago, Jef Raskin (the founder of the Macintosh project) asserted that the desktop interface strategy was “inefficient and inhumane.”

Here are some of the key arguments he made in his book “The Humane Interface” (mixed with my personal analysis):

1. The Desktop environment enables Applications to exist. Apps are modes, and anything modal in an interface sets the user up for errors and slips. Plus, the more ways there are to do something, the more time we spend fussing over our options instead of just doing it (Hick’s Law). The App economy is also just a massive waste of human capital—just think about all the wasted time we have collectively spent engineering the same feature again and again for every new App, when we could have been crafting unique commands that users can choose to obtain a la carte.
2. The Desktop’s reliance on the mouse as a pointing device is extraordinarily inefficient to navigate.
3. File naming and organization as a whole is an exercise in futility. When saving a document, for example, our locus of attention is not on coming up with a unique and memorable name—we just want to save our work. Seemingly minor moments of friction such as this burdens our cognitive load, distracting us from our intentions and from entering flow state.

In addition, as someone who lives with a delightful host of neuroatypicalities, I have found it impossible to get anything done unless I reach flow-state. The frictions and distractions in conventional operating environments make that all but impossible. And don’t tell me that it’s just a matter of discipline. Because….

The System has failed us.

Raskin defines the ideal humane interface as “responsive to human needs and considerate of human frailties.” For a while I wasn’t sure what he meant by that second bit, until I came to the following realization:

An interface that intentionally exploits the vulnerability of human beings for financial or otherwise selfish gain is inhumane and also despicable.

An interface that unintentionally allows the former to take place has
not been considerate of the full extent of human fragility, and is therefore still inhumane.

The endless News Feed casinos that were designed specifically to turn a generation of people into machine-state information banks? Inhumane.

The tippity-tappity stream of Stories optimized to maximize ~engagement~? Inhumane.

The desktop AND mobile operating systems that allowed for the former interaction paradigms to exist in unchecked Sandbox-App environments? Inhumane.

It is time for the Desktop metaphor to die.

So…what now?

For 46 years we have been iterating and building our lives upon a system that is fundamentally inhumane. We have relied on and waited for the permission of the tech titans to move from one paradigm to the next. But I think the “technology revolution” has yet to come. The true revolution will come when we are able to demand and author change from a grassroots level.

And so, I have made it my life’s mission to help inspire this change in any way that I can. I have spent the past nine months feverishly digging rabbit holes—researching, questioning, and prototyping—every “answer” uncovering even more questions.

That said, I think I’ve finally found something worth sharing with the world.

Introducing Mercury.

Mercury is a speculative vision of a modeless, fluid operating system driven by human intent.

It is designed for a tablet device with keyboard and multi-touch input affordances. This was a choice I made to maximize scalability in the road towards the true north star of device agnosticism. It also happens to be an existing device category currently stuck in between two worlds, with the potential to become something far greater than the sum of its parts.

I also wish to emphasize that the ultimate goal of presenting Mercury to the world is to start conversations in the design communities I am grateful to be a part of. In doing so, I hope to open up this white-male dominated narrative to more voices of the world.

I do not believe Mercury to be the only direction worth pursuing. However, I do hope that it will be a source of inspiration for young designers who are trying to find their place in the industry.

Because the world doesn’t need another operating system.

The world needs more voices asking questions.

And with that, let’s begin the conversation.

The full case study will be released week of May 27, 2019. In the mean time, you may visit the site below for a teaser.

MercuryOS

Jason Yuan

Humane Interface Designer and Advocate

Twitter | Instagram | Website | Email

The desktop metaphor must die was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

I remember trembling with excitement (and a tinge of fear) as I hit the publish button at 8PM. I remember sharing happy tears with those who kept me afloat through ugly tears. I remember waking up at 6 AM the next day to dozens of notifications — and watching that number jump into the hundreds as I waited in line for my usual (large iced Americano with an extra shot) at Coffee Lab.

I remember realizing that my life was about to change.

As I watched my view-count explode in the hours that followed, I found myself in awe of just how many people were saying yes to me and my story.

My design career, up until that point, had been defined by rejection. When my transfer application was rejected by RISD’s graphic design department in Fall 2016, I thought to myself “*many expletives deleted*, I’ll just teach myself through internships.” Apparently, the world had other plans, as every single internship application I sent out for design was rejected. Every. Single. One. It was as if the universe was telling me to quit design. If I’m honest, I even began to entertain the notion myself…

But I didn’t. I couldn’t. Not when I loved design as much as I did.

So I kept going, and instead of relying on academic institutions or the validation of HR departments, I set out to teach myself as much as I could about product design through researching and redesigning Apple Music.

Clutching my Large Iced Americano (extra shot) a little too tightly, I realized that it was all beginning to pay off. In the following days, I would receive thousands of notes from people all over the internet. I never managed to finish my coffee that day.

Mark Otto on Twitter

Real talk, as an Apple Music user, this all looks great. https://t.co/ld7J8swgyP

Eventually, my story snuck its way through the glass gates of Silicon Valley, and I began receiving pings from the very same companies that had said no to me just months prior. I remember a Googler on Reddit saying that Apple had made a mistake rejecting me…funnily enough, Google had been the first to dole out a rejection.

It was a bittersweet feeling, realizing that I had been “good enough” all along, yet was unable to be taken seriously by practically anyone due to my theatre degree. I had spent the few months beating myself up internally, wondering why no one was willing to give me a chance, refusing to believe that something as simple as a sheet of paper could stand in the way of my work ethic and relentless curiosity.

Did three months really change me that much? How was I suddenly qualified now? Was this all a fluke? Was Hawaiian pizza secretly underrated?

A dangerous fire was beginning to burn inside of me, fueled by the torrent of questions flowing through my mind. But no matter. Fuck my feelings, I’m blowing up on Twitter. Live in the moment and strike while the iron is hot, they told me. And so I did.

I filled up my schedule with calls, hangouts, Facetimes, even blocks of time devoted solely to answering Twitter dm’s—I made time for anyone who wanted to talk to me and started seriously considering leaving school to jump straight into the industry.

Bo Ren on Twitter

@JasonYuanDesign @AppleMusic If you are interested in an internship at Tumblr we should talk.

Through these encounters, I would come to know a number of incredible people who continue to support me on my journey. Mills from Ustwo Games, Bo and Davina from Tumblr, Zach from Vox, Daniel from Google, Jieqian from WSJ, Lionel from RGA, Vlad and Sergie from Webflow…I had the opportunity to meet most of them in person later that summer, and was deeply inspired by their passion for design, self-driven mentality, and generous spirit.

Despite all these conversations, I eventually decided to stay in school and transfer to RISD where I would study graphic design full-time for the next two years. Leaving school and following in the footsteps of Gates, Jobs, Zuckerberg et al. is considered a glorious path, but at the end of the day I wasn’t interested in following anyone else’s footsteps but my own.

I left Northwestern in June, confident in my decision to embark on my journey to become a UX designer. That summer, I spent some time catching up on coursework at RISD, a brief product design residency at Webflow, and a few trips to an unnamed fruit supplier (a story for another time).

In August, I signed a contract to intern for Apple in the summer of 2018. I let out a sigh of relief that had been building for months, only to experience the emptiness it left behind. I was achieving my dreams, but why did everything feel off?

When September came around, however, I finally broke down.

The first few months of RISD were amongst the hardest months of my entire life. I found myself consumed in guilt, frustration, and loneliness.

I felt guilty that I let my ambitions guide me away from my friendships (physically and emotionally). I felt frustrated upon realizing that those intent on pursuing UX design at RISD were woefully unsupported and even shunned by the community for being “sellouts”. I felt lonely — incredibly so —and spent most of my days wondering if I had made a massive mistake.

I realized that I had let all of the excitement distract me from the people in my life that I truly cared about. In the name of “striking the iron while it’s hot,” I prioritized interviews and networking over spending whatever time I had left with my Northwestern family, and in the process of doing so, let down some of the most important people in my life. I’m not sure if I’ll ever be able to salvage what was lost.

The sadness continues to linger, but if I’ve learned anything from the past year, it is that the absence of opportunity is an opportunity to create one for yourself. I’m finding a second wind in self-learning Cinema 4D under the guidance of the incredibly witty Devon Ko, and am supplementing my school work with readings on HCI, experience design, and motion graphics. I’ve never had the patience to sit and wait for someone to give me the permission to learn something — not when I can participate in the competitive sport known as extreme Googling.

I’ve been fortunate enough to meet some really incredible people here, and am making a proactive effort to spend meaningful time with them whenever possible. I’ve learned that time flies when you’re having fun (or being distracted by Harry Potter Hogwarts Mysteries), so it is all the more important to slow it down sometimes to really appreciate everything you are lucky enough to have.

Moving forward, I want to begin using my voice responsibly and with intention. There’s a lot that I want to do for the world of design, starting with sharing my knowledge on what it means to be an empathic designer. “Empathy” is sort of thrown around as a joke at RISD, which is unfortunate considering that’s what design needs most right now. I hope to continue writing and expressing my opinions on Medium to help uplift marginalized communities in technology and design through providing resources and guidance to those who may need it.

It will be difficult, but something tells me that it will be worth it in the end.

I’m not sure if there’s a succinct way to summarize everything I learned in the past year, but I’m going to try since I’ve rambled on for long enough.

I did not realize it at the time, but in hindsight what made my case study so successful was my motivation; I maintain to this day that my process was not driven by spite — but by a curiosity to learn all that I can, and to say yes to myself when the world was saying no.

And that really is the crux of it all: say yes to yourself, and continue doing so in-spite of seemingly impossible odds.

Jason Yuan

Graphic & UX Designer
Twitter | Instagram | Portfolio | Let’s talk!

How I changed my life with one Medium post was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.

To design is to question.

At RISD, our focus has never been on how to create, but why we create. We are trained to be future-facing, to ask how the changes in our world might be observed and developed in order to benefit us all.

We are concerned that RISD may not always be up to standards when it comes to current trends, specifically those surrounding computation and technology. Although trends are inherently ephemeral, it would be foolish to ignore them, as their impact can be significantly augmented when paired with the right kind of inquiry.

Opportunities like RISD’s CTC Concentration have been able to leverage our community’s growing interest in computational art+design. However, practice revolving around digital technologies outside established curriculum has remained limited. We attribute this to a lack of community space for students interested in said subject.

RISD IxD serves to provide a space for artists and designers at RISD to exchange ideas, share their work, and learn new skills related to digital technologies.

Currently, we plan on consistently delivering content written by and for creators affiliated with RISD. Moving forward, we hope to promote overall literacy in digital technologies on campus through community-led workshops, alternative critiques, and other IRL interactions, so that our fellow students can do what they do best:

Ask questions that have never been thought to be asked.

— Jason Yuan (GD ‘19) and Advait Kalakkad (ID ‘19), March 2018

RISD IxD

is a collective of artists and designers passionate about Interactive Experiences within the Digital Age at the Rhode Island School of Design.

Twitter | Jason Yuan | Advait Kalakkad

RISD IxD: Manifesto was originally published in RISD IxD on Medium, where people are continuing the conversation by highlighting and responding to this story.

I’d like to preface this case study by stating that my intentions behind redesigning Apple Music were in no way driven by indignation or spite.

Earlier this year I applied and interviewed for a graphic design internship at Apple Music (an opportunity of a lifetime), and was turned down with a very kind letter stating that although they liked my work, they wanted to see more growth and training.

At first, I was frustrated — Northwestern University doesn’t offer any sort of undergraduate graphic design program, so whatever growth they were looking for would have to be self taught…

…but as soon as I came to this realization, I became inspired to embark on what became a a three-month long journey to the holy grail — the iOS app that Apple Music deserves.

For me, this was an opportunity to really dig my teeth into UX research and design, an excuse to spend way too much time on Sketch and Principle, a reason to bore everyone around me with my notebook of crudely drawn wireframes 😂…

What you’ll find below is a case study offering potential solutions to address some of Apple Music’s problems, as well as ideas for future development. My process was guided by qualitative user research, Apple’s official Design Principles, and my own designer intuition.

Introduction

As a designer with a background in music composition and performance, I have always been passionate about experiences that marry music and technology. Through design, I hope to one day make the experience of music more accessible and enjoyable.

However, Apple Music has always frustrated me. What was meant to be the service to convert everyone in the world to streaming is going through puberty — a phrase which here means steadily maturing yet unattractive compared to the adults in the game (aka Spotify).

To better understand Apple Music, I took a trip down memory lane and revisited its inception. Plagued with a notoriously confusing interface and a half-baked visual identity, Apple Music’s first identity was the culprit of many headaches.

With iOS10, Apple released a much-needed update based on the principles of Complexion Reduction.

While this new interface was much easier to navigate, I still felt that there was room for improvement. Despite its simplified color palette and enlarged typography, the interface felt cluttered and even claustrophobic — a far cry from Apple’s usual elegance.

I approached my redesign in three steps, while conducting research throughout:

• Core Experience
• Brand Identity
• Visual Interface

1. Core Experience: Music Discovery

One of the first things that I found out was that users of streaming services generally fell somewhere on the following spectrum:

Hoarders:

• Have a large library that they add to from time to time
• Are more selective about what they listen to

Nomads:

• Rely on playlists/curated content
• Are probably already using Spotify

Apple Music sits at the Hoarder side of the spectrum. Open an Apple Music playlist and you’ll probably find this in the description:

If you hear something you like, add it to your library.

Treating playlists as tools to discover new music is an approach that makes sense given Apple Music’s pastlife as iTunes. However, the way that playlists are currently implemented feels very tacked on. I found that users weren’t comfortable with adding entire playlists to their personal libraries, especially if said playlists were constantly updating.

If Apple Music wants to expand to the nomadic side of the spectrum, they have to do it in a way that brings their existing user base along. This means creating a music discovery experience centered on artists and albums instead of playlists. Enter… My Sampler

My Sampler

My Sampler is a new experience made to bridge the gap between Hoarders and Nomads, replacing the current “New Music Mix.” It was born out of the understanding that users who are picky about what goes into their library would also be more reluctant to sit through an entire playlist full of new music. A better experience would be presenting snippets — or samples — of curations that gives the user just enough information to decide whether or not to add it into their library and weekly playlist.

Upon entering the Sampler, the user is presented with a series of artist headshots that correspond to a curated song. The user can tap and hold to preview 15 seconds of each song, before swiping up to reject the song or swiping down to add the song to their library.

I chose to use gestural interaction so that users can use the Sampler even if they’re not looking at the screen. Once the user has finished sampling, their selections are used to create a New Music Mix that the user can listen to.

The mechanics behind this experience was inspired by the following quote captured in an interview:

“Apple is underestimating the power of gamification.”

— UX designer and Apple Music user I interviewed in LA

I have come to understand that, through a gamified experience, the user is able to establish an immediate connection to the music they discover. In addition, the Sampler has the potential to provide Apple Music a constant stream of information regarding listener preferences, allowing the app to evolve and grow with the user.

2. Brand Identity

During my internship at Sony Music, I learned that a brand’s visual presence in a streaming service must be recognizable yet invisible at the same time. Spotify does this very well in their use of halftone photography and “Bursts” in their playlist album artwork.

In comparison, Apple Music’s visual branding has right now is kind of all over the place:

There’s a mix of symbols, 3D typography, and black & white photography.

In addition, there are collage-themed covers that don’t really communicate anything about the mood/feel of the playlist.

The main issue seems to be Apple Music throwing everything at the wall to see what sticks, instead of really developing a consistent visual language that signifies Apple’s presence in the app amongst a sea of album artwork.

My solution was built on the following principle:

Album Artwork should be treated as part of the UI, and not a stand-alone visual component.

Artist Spotlight Artwork:

Inspired by Apple Music’s Welcome Screen, I chose to showcase artist headshots within a circular motif. The circle shape was inspired by the iPod clickwheel — an iconic part of Apple’s music legacy. The “face inside a circle” motif is also seen other aspects of iOS, most notably Contacts.

In addition, I chose San Francisco so that the Artist Spotlight artwork would harmonize with the UI. Lastly, I limited the color palette to different shades/tones of blue, violet, and red to reflect the Apple Music Icon.

Curated Playlist Artwork:

For Curated Playlists, I wanted the look to be consistent with Artist Spotlights while showcasing an aspect of the playlist’s mood/vibe through use of color. More vibrant images are displayed against a backdrop of the same image with a gaussian blur filter (inspired by iOS’s background blurs). For certain covers, I also added a subtle gradient of Apple Music’s signature red to add a sense of dimension.

Core Playlist Artwork:

Finally, I updated the centered graphics for some of the core playlists with the same typography used for the Artist Spotlights and Curations.

I think this new branding scheme harmonizes well with the rest of the UI, and am curious to see if this circular motif could also be somehow animated upon user input…

3. Visual Interface

General Improvements

The chief complaint I heard about the current interface was that it felt too sterile and lacked an element of delight. To begin resolving this, I optimized white space through subtle app-wide adjustments as demonstrated below:

Library

I didn’t think major alterations to the Library tab were necessary, so I limited the changes to the standard white space and typesize adjustments. I removed Downloaded Music as a default menu option because I think the app should self-adjust what music the user is able to access based on the availability of LTE/WiFi.

Below are some subtle animation details (present in all tabs) I added to make the app feel less sterile.

For You

“For You” is the beating heart of Apple Music. It’s where Apple Music gets to flex how much it knows about the user by curating playlists and albums based on what the user has “Loved.”

I received a ton of feedback on how random the current “For You” felt, so for my redesign I aimed to reduce the amount of content thrown at the user while increasing the relevance of whatever’s left… like Facebook and Instagram’s “Top Posts.”

The redesigned “For You” begins with “My Sampler” in lieu of the current “My Favorites Mix” and “My New Music Mix”. “Recently Played” is kept intact, as users found it to be quite useful.

Scrolling down, you’ll find that I’ve changed the “Insert Day of the Week Here — Playlists” to a specific Mood that will adjust based on location, time, and recent social media activity.

Wouldn’t it be awesome if, immediately after checking into a café on Facebook, Apple Music updates this Mood section to Focus/Study playlists?

Below that is the Daily Stream, an example of how exclusive video content can be pushed to the user based on their preferences. For example, I really like Katy Perry, so if a Katy Perry episode of Carpool Karaoke is released, the Call-To-Action can be changed to place the emphasis on Katy’s appearance.

Afterwards, you’ll find the classic Artist Spotlights, which I kept in this demo to show how the new visual branding schemes works in harmony with the rest of the UI.

And last but not least, users get a preview of their most-loved/played genres so that they have quick access to more music if nothing in the For You feed was able to pique their interest.

But whatever happened to Connect?

Good question. Truth is, I didn’t see any data from my research that would justify keeping the Connect feed in the app as is. Users were more interested in connecting with friends and family through music (a la Spotify) instead of with artists through a watered-down Twitter.

I think Apple should focus on integrating existing social media with Apple Music instead of trying to push yet another one on its already overburdened consumers.

Browse

The majority of feedback I received regarding the current Browse screen was that it felt too sterile and uninviting. Some users also expressed confusion regarding the differences between “For You” and “Browse.”

My solution was to redesign the Feature Slides in the style of Apple’s Website — Jumbo slides that fill the viewport width, with a horizontal indicator of where the user is in the slideshow. I believe this change makes Featured content feel more inviting and less intrusive/random.

I also merged the Radio menu into the existing Browse menu.

Watch

Earlier this year, Apple confirmed that Apple Music was expanding into video streaming content in an effort to turn Apple Music into a pop-culture central. I was curious how this will play out especially in the context of the mobile app, so I created a separate tab specifically for browsing exclusive video content and music videos.

There will eventually be enough content to justify a dedicated tab, but for now I based my design decisions on leaked information as well as Apple Music’s existing visual language.

Search

The main problem with how Apple Music handles search right now is that it is based on a mode system: where you can either search in Apple Music or your library — but not both.

Two years into using this app, I still find myself getting frustrated at being in the wrong mode, especially since the Library mode handles keywords differently:

My solution was to merge the two modes into one general “search” that displays results from the user’s library first, followed by anything else that is available on Apple Music.

Support for fuzzy keywords should extend to the user’s Library content. It will also be interesting to see if results for keywords relating to moods or activities can be implemented in the future.

Now Playing

I like what Apple has done with the Now Playing screen, and didn’t think any major adjustments were necessary. I decided to keep most of the visual interface as is. However, I thought a great way to build upon the existing experience would be to incorporate some simple gesture interactions.

To many users, myself included, the necessity of “training” Apple Music through the “Love” and “Dislike” commands was unclear. This can be partially attributed to be how well said commands are hidden; the process of “loving” a song on mobile requires users to open a separate menu — a tedious process that trivializes its impact.

My solution was to implement a gesture that most users are already familiar with — the double tap — into the Now Playing experience. I observed that many users tried to press the “floating” album art in the present release (it just looks so delightful)…why not add a response?

In addition, I added sneak peeks of adjacent tracks that users can skip to through a horizontal swipe. I believe this will grant users more control over their listening experience in an intuitive way.

What’s Next?

Looking back at the initial scribbles I made on my notebook during my initial brainstorming sessions, I’m happily surprised at the amount of progress I was able to make in three months.

Going into this process, I had no working knowledge of Principle and could barely edit blend modes in Sketch. Now…to be honest, I still consider myself a novice in said prototyping apps, but hey, I was able to make something happen — and that’s the best I could have hoped for.

I don’t expect the good folks at Apple Music to take anything from this case study. In fact, I might actually have a heart attack if anyone working on Apple Music stumbles upon this article… but if you’re out there, I hope my work was able to give you some ideas and spark some conversations!

Through this project, I have come to understand the value of my theatre background in relation to UX design — experience designers and theatre artists are alike in their shared understanding of human empathy. Take that, literally everyone who rolls their eyes at my resume!

Soon, I will be embarking on my next great adventure: BFA Graphic Design at Rhode Island School of Design. Although it feels strange to say goodbye to this process (and to Northwestern University), I sincerely hope that this is just the beginning of a career in experience design… a career of changing the world through empathy.

Jason Yuan

Visual & Experience Designer
Theatre/Communications Junior, Northwestern University
Twitter | Instagram | Portfolio | Let’s talk!

I Got Rejected by Apple Music… So I Redesigned It was originally published in Startup Grind on Medium, where people are continuing the conversation by highlighting and responding to this story.

Welcome to the NU Brand Bootcamp, a personal project I am undertaking this quarter. Every week, I will explore and redesign a logo of a Northwestern University student organization as a means to grow as a designer and understand what it takes to truly build a brand.

Stuco, or the “student theatre coalition,” is an umbrella organization encompassing nine “theatre boards” that are responsible for the majority of theatre productions on campus.

Each board also has their own logo, ranging in style and quality…

Recently, I was stuck with an idea. “What if I could unify all the theatre boards under a unified Stuco™ brand?” I got to work, only to be stalled under my other commitments like classwork and sleep. And so, I refocused my energy on one particular board… (for now 😉)

Wave Productions

Wave exists to share the stories of the past and present in order to open the door to a better future.

I set out to reimagine how Wave’s mission statement and personality could be visualized in a way that captures the timelessness of their mission as well as the quirkiness of their executive board members.

Making Waves

I started with a typographical approach, attempting to merge the infinity loop with letterforms.

Then, I had an epiphany — perhaps the infinity loop does not have to be part of the brand. After all, if the “beauty of theatre” lies in the ephemeral, why brand it as something infinite? With my second set of sketches, I wanted to capture the idea of an ephemeral moment making lasting waves.

I liked this new direction a lot, and moved onto vector prototypes.

Happy with the look of the graphic, I selected Apercu as the accompanying typeface. In addition to picking a bright blue for color, I created separate element to accompany the logo on Wave communications to further its distinctiveness and add a sense of whimsicality back into the brand.

I’m quite happy with how everything turned out, although I wonder how the logo would fit into a wider Stuco branding revamp…but that’s an adventure for another time. As always, thank you for supporting me and my project, and I’ll leave you with a much anticipated before and after comparison!

Let me know what you think!

Jason Yuan

Visual & Experience Designer
Theatre/Communications Junior, Northwestern University
Twitter, Instagram, Portfolio
Chat with me!

All work produced as part of this series should be viewed as work in progress instead of finalized rebranding proposals. If an organization wishes to pursue any of the solutions formally, please contact me directly!

Welcome to the NU Brand Bootcamp, a personal project I am undertaking this quarter. Every week, I will explore and redesign a logo of a Northwestern University student organization as a means to grow as a designer and understand what it takes to truly build a brand.

SHAPE (Sexual Health & Assault Peer Educators)

Mission: “to provide education, organize events, and stimulate discussion and awareness on issues surrounding sexual health and sexual assault”

Brand Evolution:

The five-shape motif has been the backbone of Shape’s visual presence on campus since the dawn of their Facebook page. Shape’s current logo communicates approachability and education through its bright colors and whimsical geometry. Though it’s pretty obvious that the overlapping geometry references their acronym, I couldn’t find any information on why those five shapes/color combos were chosen and what facets of Shape they represent.

Personally, I thought it read a bit juvenile for a college student group centered around sexual health and assault — especially one that has the cheek to organize something called the G-Spot!

Reshaping SHAPE…

Due to personal reasons (aka me casually forgetting my charger at home whilst frolicking to California for Spring Break), I started the redesign process through hand-sketching:

I really liked the constellation idea, so I moved forward with a vector prototype…

…only to scrap it immediately. It wasn’t terribly offensive or anything, but the constellation reminded me more of molecular biology than sexual assault education. I went back to the drawing board:

Moving to the computer, I started wondering if I could somehow preserve the geometric quality of the original logo whilst adding a sense of playfulness. Inspired by a Lynda Tutorial on Bauhaus Typography, I created custom typography using geometric shapes.

I was pretty happy with how the letters turned out, and started to experiment with color. In the original SHAPE logo, five colors were used: red, orange, yellow, green, and purple. Presumably, this was to reference the range of topics and identities represented by SHAPE’s work.

I tried bringing this rainbow motif to the new logotype…

But felt that it could be misinterpreted for a LGBTQ-focused group instead of one on sexual wellness and education. Hence, I shortened the spectrum of colors to focus on magentas and blues — as an homage to Planned Parenthood and the transgender flag.

I paired the logo with Proxima Nova Soft, a typeface that retains the geometry of the logo while balancing out its sharp edges with round ones. Finally, as an added bonus, the letters can be rearranged vertically to “penetrate” each other, for use as graphical elements.

There is obviously much more to explore regarding the visual identity of SHAPE (just think of the animations!), but for the sake of time, this is all I’m going to explore for now. Here’s a comparison shot to tide you through to next week…

Let me know what you think!

Jason Yuan

Visual & Experience Designer
Theatre/Communications Junior, Northwestern University
Twitter, Instagram, Portfolio
Chat with me!

All work produced as part of this series should be viewed as work in progress instead of finalized rebranding proposals. If an organization wishes to pursue any of the solutions formally, please contact me directly!