• Craig Martinson

The Vibe: Beam Me Up Hottie


Overview

9 design hours

4 episodes of the X-Files

1 job interview scam : (

Way too many sour patch kids


The Concept

A dating app that helps science fiction lovers find love. It's like Tinder in space!


So What Do We Call This Thing?

This week was a little different. I was really struggling to find the vibe or cultivate any discernible design direction. Then I noticed the word "love" written above Russ's left knee and the UFO drawn on his right thigh. Love Beam popped into my head before I even knew what I was making. I even started sketching logo designs before the dating app concept fully emerged.


Who Is It For?

Love Beam is for hardcore science fiction enthusiasts tired of Tinder hoping their treasured tales of time travel, extraterrestrials and technological terror can translate into true love. Say that five times fast. I dare you.


The Color Palette

The Love Beam color palette actually evolved several times during the design process. I originally had a maroon, orange/red, dark green, sea foam green, and a faded blue. However, as the final style began to emerge, I pivoted to a more focused and punchier palette.

We have a classic cherry red, dreamy blue, grass green, and (almost) black.


Logo Concepts

Here we have the "Attractor Beam" logo concept in three different styles. You can see some of the colors that were phased out of my final design in v2 and v3. I really like v2, but it didn't vibe with the other elements of the app.



Iconography

I had a lot of fun making this abridged Love Beam icon set. I am particularly proud of the alien lovers, the phasing heart and the ray gun.

Badge System

My hope was to make Love Beam an exclusive service for true sci-fi devotees so I implemented a badge system. Your top sci-fi franchises will appear below your name and age without titles. If you know, you know. This idea definitely needs some user testing! Here are some sample badges.

Major Screens

Ooo baby! Look at that shiny Love Beam Logo! I'm not going to lie, I'm really proud of this one. But, enough about me... Next to the splash screen is a snapshot of the on boarding process. Users will simply tap on all the sci-fi shows they love on their way to setting up a Love Beam Profile. Lastly is the home screen. This is where the magic happens. I'm definitely heavily borrowing from the Tinder UI implementing a top nav to save the bottom of the screen for folks who would rather tap than swipe. Honestly, it's just a smart design and improves user quality of life.

Love Beam In Action!

Jason seems like a cool guy so I beam him up!


In Conclusion

Love Beam was a strange journey full of twists and turns and I wouldn't have it any other way. I loved unraveling the design mystery like a UI Agent Fox Mulder... The UX Files! Get it? I loved revisiting all these stories which have meant so much to me over years and I hope you did too. Until next time. Kirk out.