‘AirCard’ — An Unorthodox UX/UI Case Study

Making person-to-person contacts, in an instant- with innovation!

2018 And We Still Do It Like This? The Problem~

You run into someone and decide you want to store their contact info onto your phone- this scenario plays out millions of times per year (worldwide) and usually goes something like this; “hey what’s your number so I can call it and you can store my info and i’ll store yours.” Does this sound familiar? It’s 2018 and is this the best way we can exchange contact info in person? How do you feel about this method? Is there an app that allows instant person to person contact creation? How about a prototype app……anyone?

‘BarMe’, Ooops ‘AirCard’ Answers The Call!

AirCard” is a prototype app that almost didn’t make it past user testing- let me explain. AirCard was intially called “BarMe” (bar me) as the initial concept was based on the idea of using bar code technology. Bar code technology is an outdated technology as far as vast databases queries are concerned and is limited to it’s range of available user generated data in it’s current form- so the idea had to be scrapped…. or did it?

Going Backwards to Go Forwards

Before I get into all the details on the inner workings of how the proposed BarMe app would have worked- let me begin by further describing the problem it was designed to address and work backwards from that point, please read on.

Social Media- Connecting Virtually- but Not In Person!

Social media is huge- we all know how popular Facebook, Instagram, Twitter and the rest are. One of the reasons for the incredible growth of social media is the ease of which social connections are made. Many apps allow you to connect to others in the press of a button- quite literally! But what about person to person everyday contacts- how do we go about making those connections? Well as it turns out- I created a survey asking exactly that and the response was compelling.

It turns out most people were unhappy with the current method of making those direct person to person connections- and just how are people saying they make those connections?

Survey data along with 5-person interviews revealed most people were connecting using their cell phones; but how were they doing this?

The interviews revealed most people simply asked another person to call them after which the recipient would store the callers name and add this information to their contact list. This process of calling and storing information was fraught with problems and frustrations. Some interviewers stated they misspelled names or forgot the person’s name entirely further embarrasing the situation or calls didn’t go through prompting another attempt etc…perhaps you yourself have tried this method for storing someone’s contact info?

The Birth of BarMe- The Mocking!

The idea of BarMe arose to address this dilema of instant contact creation by way of scan-able bar codes. I created a low fidelity mockup that would allow app users to scan other users’ codes of which would identify the user and allow their contact info to be stored- but there were 2 problems with this approach. One problem is that traditional bar codes (as mentioned previously) are limited in it’s data capacity as it was designed as a single scan stripe system that would query a database for the ‘info’ and simply wouldn’t cut it for todays vast potential user database. The second problem was that users didn’t want to use scan-able codes…I tried to bypass problem one by adopting QR Code technology but again usability testing revealed users didn’t like the idea of using the phone’s built-in camera to scan code. Further research into QR-code technology and applications that used it revealed SnapChat was the most successful but only 4% of it’s user base actually admitted to using it regularly. Clearly my usability testers weren’t alone in their dislike for using QR codes- I promptly abandon scanable codes….but what to do now?

You Marry The Problem Not The Solution - UX cardinal sin!

Innovation Not Seen Before- The Prototype Proposal

As a UX/UI designer I’ve learned you marry the problem, not the solution- solutions can and will change but the problem you’re designing for usually remains constant- I design for solutions! Continuing on with devising a solution to this problem of direct person to person contact sharing- a solution arose! It was a solution based on current technologies but not widely known (or implemented) and definitely not known to be used in this manner. I proposed using a hybrid mix of technologies; ‘AirDrop’ ‘Bluetooth LE’ and GPS (both USA and Russian, GloNAS)~ ‘Geo-Tagging’ implementing trilateration in the form of iBeacon technology!

Using trilateration with BlueTooth LE and iBeacon Technology allows cell-phones to be ‘aware’ of their proximity and hybrid AirDrop tech allows person-person card transmission

AirCard would use the aforementioned technologies of ‘AirDrop’ ‘Bluetooth LE’ and ‘Geo-Tagging’ and use trilateration to calculate nearby users and allow each cellphone using the AirCard app to be aware of each other and allow the sharing of “cards” the users would like to share and receive- let me explain further. Imagine you’re a current AirCard user and others around you use the app as well- you would create ‘cards’ you’d like to share (think business cards) and any cards you select can automatically be received by any user with the AirCard app- if the other user wants to store your card- they simply scan the area and all nearby “AirCards” are displayed- the user can now add it to their contacts and within a second all the info you’ve posted to that card is now instantly stored in their contacts- that’s what I call “instant connections.”

The Viability of AirCard

You might be asking- is this possible and why hasn't anyone done this? The answer to question 1 is yes, this is possible (with current technologies) and the answer to question 2 is a bit more complex. While iBeacon technology is viable and when mixed to form a hybrid of the mentioned technologies using trilateration no one has created a user interface to create an app that combines all of the tech to feature the featurset as I’ve proposed. The need is clearly there as demonstrated by my user surveys and user interviews but again, no one has devised a solution until now.

Creating the App~ The User Interface

In creating a user interface I have to note all features I’m trying to solve for and test for usability and desirability. Testing revealed users wanted a simple interface and extreme ease of use. Testers also stated if the app is to allow instant contact creation it should allow this with as few call to actions as possible. I go back to my testing notes for the “BarMe” iteration and note most users wanted a simple button layout and quick access to contacts- so keeping the users need first and formemost I develop a 3-button layout which would allow easy, quick thumb optimized access for those users who hold the phones 1 handed (my reserach indicated most users were holding their phones single handed.) In using a 3-buttom layout I constrain all the apps features to be used in no more than 3 presses.

Prior to commiting to any design elements I have to decide on the “look and feel” the app must evoke. In devising the “brand” identity I turn to Gestalt principles and color psychology to match the brand and “feel” of the app. Color psychology revealed cool blue tones would suggest honesty, imagination and intelligence- all traits which are in line with the design parameters of this app design and I go to Adobe’s Color CC site to devise a color pallete in line with this mindset and create a moodboard and style tile which reflect assetts accordingly.

User Dictated Design Iterations

Color-scheme in hand, I turn to user card sorting to understand my users needs and refine app features. Users specified they’d like editable contact “cards” made for “friends, family, work and emergencies.”

Wireframe Mockups evolved into Mid Fidelity prototypes then progressed into High Fidelity Mockups
QR Codes were abandoned and Wireless Protocols were Implemented during the design phase

In response to testing, design iterations mature from the initial “BarMe’ concept to the “AirCard” version with design traits from the moodboard and style tile.

App screens were revised to reflect user feedback and testing

Commercial Implications!

“AirCard” could be classified as a disrupter app as it not only disrupts the current method of direct person to person contact creation but also shows incredible potential for commercialization. If businesses would adopt the iBeacon technology or any variation (enhanced WiFi) and GPS that “AirCard” could utilize in it’s UI, “AirCard” could display business “cards” directly from vendors nearby. Imagine walking to the street or mall and using “AirCard” to scan the surrounding areas to discover the nearby “H&M” store is offering a “free” T-shirt with purchases over $19- or McDonald’s is offering free drinks with purchases over $5 or similar “coupon” or “special offers” without spending a dime to advertise it….merely show the app “card- coupon” at the counter. The advertisements could be changed per location to optimize advertising for that market region…..the possiblities are virtually endless!

AirCard user sees H&M 75% off Special Coupon

The End- or Just the Beginning?

AirCard addresses the issue of sharing instant person to person contact info and opens the door to broader applications as a commercially viable “advertising” platform for businesses. AirCard was desinged to be incredibly simple to use and users could select which ‘cards’ they want to save and businesses could tailor their advertising needs to match regional goals. AirCard has been discribed as a disrupter app and that’s exactly how I see it.

I’ve taken the prototype to Mitch Schussler, a top NYC financial services app developer and am in talks of taking the app to full developement. There are still questions to be answered but for now the future holds promise for “AirCard.”

AirCard Video Presentation at Ironhack Miami, FL

AirCard was presented at the 2017 December “HackShow” at Ironhack’s Miami Florida location- below is the video of the presentation.

Thank you for reading this unorthodox case study on AirCard, should you have any questions or comments please feel free to contact me at: steve@stevenunez.com

Design Portfolio: