Situation
In 2013, their main source of revenue, Karmaloop, hadn't paid in 6 months. Could we move the market and create a new source of revenue in time?
When I first joined Apliiq as their lead ux/ui designer, their main source of revenue hadn't paid in 6 months. Karmaloop was filing for chapter 11 bankruptcy. Would we be able to move the market and create a new source of revenue in time?
When I first joined Apliiq as their lead ux/ui designer, their main source of revenue hadn't paid in 6 months. Karmaloop was filing for chapter 11 bankruptcy. Would we be able to move the market and create a new source of revenue in time?
When I first joined Apliiq as their lead ux/ui designer, their main source of revenue hadn't paid in 6 months. Karmaloop was filing for chapter 11 bankruptcy. Would we be able to move the market and create a new source of revenue in time?
Task
My role on the team was lead ux/ui designer. Together with the CMO, Ian Gruber (left) and CTO, Thanh McDowell (right), we set out to help Apliiq create a new source of revenue.
My role on the team was that of the lead ux/ui designer. Pictured here you can tell we were a lean ux team. From left to right, you have the CMO, Ian Gruber, Lead UX/UI Designer, Myself, and CTO Thanh McDowell. Together we were a formidable integtrated new product development team.
My role on the team was that of the lead ux/ui designer. Pictured here you can tell we were a lean ux team. From left to right, you have the CMO, Ian Gruber, Lead UX/UI Designer, Myself, and CTO Thanh McDowell. Together we were a formidable integtrated new product development team.
My role on the team was that of the lead ux/ui designer. Pictured here you can tell we were a lean ux team. From left to right, you have the CMO, Ian Gruber, Lead UX/UI Designer, Myself, and CTO Thanh McDowell. Together we were a formidable integtrated new product development team.
Action
After reading the Lean Start Up by Eric Ries, and Creating Breakthrough Products by Cagen and Vogel, I was eager to lead a Lean UX iNPD (integrated new product development) team.
Storyboarding
In this storyboard, I'm illustrating the different contexts the target user persona, in this case metropolitan millennial hipsters, live throughout their day. You can see the how the "one thumb one eye" behavior plays a pivitol role in usage when considering mobile.
In this storyboard, I'm illustrating the different contexts the target user persona, in this case metropolitan millennial hipsters, live throughout their day. You can see the how the "one thumb one eye" behavior plays a pivitol role in usage when considering mobile.
In this storyboard, I'm illustrating the different contexts the target user persona, in this case metropolitan millennial hipsters, live throughout their day. You can see the how the "one thumb one eye" behavior plays a pivitol role in usage when considering mobile.
Mobile-First Wireframes and User Flows
Here are sketches of the first user flow for mobile. You cand see the corner navigation being ever present at the beginning of ther user flow, yet when the filter is open it covers the navigation to focus on the plethora of product options and customizations.
Here are sketches of the first user flow for mobile. You cand see the corner navigation being ever present at the beginning of ther user flow, yet when the filter is open it covers the navigation to focus on the plethora of product options and customizations.
Here are sketches of the first user flow for mobile. You cand see the corner navigation being ever present at the beginning of ther user flow, yet when the filter is open it covers the navigation to focus on the plethora of product options and customizations.
Here are sketches of the first user flow for mobile. You cand see the corner navigation being ever present at the beginning of ther user flow, yet when the filter is open it covers the navigation to focus on the plethora of product options and customizations.
Multi-Variate Testing
Every time the visitor would return to the website, there would be a new fabric pattern as the background image. This design beat the original website design in consecutive A/B tests.
I believe this page out performed the orginal because of the following; no scroll, encapsulated call to action, and the "why" (Revolutionize Consumption) as the headline.
Every time the visitor would return to the website, there would be a new fabric pattern as the background image. This design beat the original website design in consecutive A/B tests.
I believe this page out performed the orginal because of the following; no scroll, encapsulated call to action, and the "why" (Revolutionize Consumption) as the headline.
Every time the visitor would return to the website, there would be a new fabric pattern as the background image. This design beat the original website design in consecutive A/B tests.
I believe this page out performed the orginal because of the following; no scroll, encapsulated call to action, and the "why" (Revolutionize Consumption) as the headline.
Every time the visitor would return to the website, there would be a new fabric pattern as the background image. This design beat the original website design in consecutive A/B tests.
I believe this page out performed the orginal because of the following; no scroll, encapsulated call to action, and the "why" (Revolutionize Consumption) as the headline.
A/B Test Results
Although, the corner navigation performed well, the "Netflix style" horizontal shopping experience reduced conversions.
Therefore, we had to re-design the shopping page.
This was the new mobile shopping experience. It did not fair well in A/B testing on desktop. The Netflix style horizontal sliders may have performed well on mobile, but it just wasn't a significant enough boost.
That corner nav was hot though!
This was the new mobile shopping experience. It did not fair well in A/B testing on desktop. The Netflix style horizontal sliders may have performed well on mobile, but it just wasn't a significant enough boost.
That corner nav was hot though!
This was the new mobile shopping experience. It did not fair well in A/B testing on desktop. The Netflix style horizontal sliders may have performed well on mobile, but it just wasn't a significant enough boost.
That corner nav was hot though!
Results
An A/B test concluded that the corner navigation on mobile had a 300% increase in newsletter signups. This increased new customer acquisition, all because mobile-first forced our team to make the tough decisions. What were the 4 most important navigation items?
An A/B test concluded that the corner navigation on mobile had a 300% increase in newsletter signups. This increased new customer acquisition, all because mobile-first forced our team to make the touch decisions. What were the 4 most important navigation items?
An A/B test concluded that the corner navigation on mobile had a 300% increase in newsletter signups. This increased new customer acquisition, all because mobile-first forced our team to make the touch decisions. What were the 4 most important navigation items?
An A/B test concluded that the corner navigation on mobile had a 300% increase in newsletter signups. This increased new customer acquisition, all because mobile-first forced our team to make the touch decisions. What were the 4 most important navigation items?
Here is a screenshot of the original "upload your artwork" button. It allowed you to upload any image you wanted, and place it on the shirt.
User contributed artwork increased sales exponentially. They rather buy their own artwork, instead of something predetermined.
Here is a screenshot of the original "upload your artwork" button. It allowed you to upload any image you wanted, and place it on the shirt.
User contributed artwork increased sales exponentially. They rather buy their own artwork, instead of something predetermined.
Here is a screenshot of the original "upload your artwork" button. It allowed you to upload any image you wanted, and place it on the shirt.
User contributed artwork increased sales exponentially. They rather buy their own artwork, instead of something predetermined.
Once uploaded, the user could move the artwork any where on the front of the model.
Once uploaded, the user could move the artwork any where on the front of the model.
Once uploaded, the user could move the artwork any where on the front of the model.
Once uploaded, the user could move the artwork any where on the front of the model.
In fact, upload had become such a popular feature, my intuition began to question the very complexity of the legacy interface.
In fact, upload was becoming such a popular feature, my design thinking background began to question the very complexity of the legacy interface.
In fact, upload was becoming such a popular feature, my design thinking background began to question the very complexity of the legacy interface.
How simple could we make the user interface?
How much simpler could I make the user interface?
When we ask the question, "what's the most popular product on our website?" The answer was unequivocaly the pocket tee.
When we ask the question, "what's the most popular product on our website?" The answer was unequivocaly the pocket tee.
When we ask the question, "what's the most popular product on our website?" The answer was unequivocaly the pocket tee.
When we ask the question, "what's the most popular product on our website?" The answer was unequivocaly the pocket tee.
It was time to distill the experience down to its essential value proposition.
It was time to distill the experience down to its essential value proposition.
In this video you can see how the user can upload their artwork into the pocket through a very distilled user interface.
I handed coded this SVG and jQuery interaction experience.
In this video you can see how the user can upload their artwork into the pocket through a very distilled user interface.
I handed coded this SVG and jQuery interaction experience.
In this video you can see how the user can upload their artwork into the pocket through a very distilled user interface.
I handed coded this SVG and jQuery interaction experience.
In this video you can see how the user can upload their artwork into the pocket through a very distilled user interface.
I handed coded this SVG and jQuery interaction experience.
The demand for customization from customers never ceases to amaze. With the sermounting pressure from our customer base, we had to come up with a way to mass produce pocket tees with custom artwork, and embroidery. With a pile high stack of orders on our workshop table, how we're we going to be able to keep up with demand?
The demand for customization from customers never ceases to amaze. With the sermounting pressure from our customer base, we had to come up with a way to mass produce pocket tees with custom artwork, and embroidery. With a pile high stack of orders on our workshop table, how we're we going to be able to keep up with demand?
The demand for customization from customers never ceases to amaze. With the sermounting pressure from our customer base, we had to come up with a way to mass produce pocket tees with custom artwork, and embroidery. With a pile high stack of orders on our workshop table, how we're we going to be able to keep up with demand?
The demand for customization from customers never ceases to amaze. With the sermounting pressure from our customer base, we had to come up with a way to mass produce pocket tees with custom artwork, and embroidery. With a pile high stack of orders on our workshop table, how we're we going to be able to keep up with demand?
In order to afford the level of customization our customers were craving, and to have the capability to meet their demands, we needed an embroidery and laser machine.
This is the Kickstarter video for our crowdfunded campaign.
In order to afford the level of customization our customers were craving, and to have the capability to meet their demands, we needed an embroidery and laser machine.
This is the Kickstarter video for our crowdfunded campaign.
In order to afford the level of customization our customers were craving, and to have the capability to meet their demands, we needed an embroidery and laser machine.
This is the Kickstarter video for our crowdfunded campaign.
In order to afford the level of customization our customers were craving, and to have the capability to meet their demands, we needed an embroidery and laser machine.
This is the Kickstarter video for our crowdfunded campaign.
We did it!
Successfully raised $25K+ in just 30 days time.
We did it. We were successfully able to raise revenue by $25K+ within just 30 days time.
We did it. We were successfully able to raise revenue by $25K+ within just 30 days time.
This gave us the ability to attract new customers like the streetwear fashion company Underground NYC.
This gave us the ability to attract new customers like the streetwear fashion company Underground NYC.
This gave us the ability to attract new customers like the streetwear fashion company Underground NYC.
This gave us the ability to attract new customers like the streetwear fashion company Underground NYC.
This was when our product started to really take strides. The combination of Underground NYC's photography and our product began the avalanche of what would ultimately help move the market.
This was when our product started to really take strides. The combination of Underground NYC's photography and our product began the avalanche of what would ultimately help move the market.
This was when our product started to really take strides. The combination of Underground NYC's photography and our product began the avalanche of what would ultimately help move the market.
This was when our product started to really take strides. The combination of Underground NYC's photography and our product began the avalanche of what would ultimately help move the market.
This is what Underground NYC was able to do with our new pocket artwork service.
This is what Underground NYC was able to do with our new pocket artwork service.
This is what Underground NYC was able to do with our new pocket artwork service.
How were we going to scale this new magnificent product?
At the time, people hadn't quite caught up to Underground NYC and their intense movitivation to start their own brand.
Yet, there was a demographic that was. College students.
How were we going to scale this new magnificent product?
At the time, people hadn't quite caught up to Underground NYC and their intense movitivation to start their own brand.
Yet, there was a demographic that was. College students.
How were we going to scale this new magnificent product?
At the time, people hadn't quite caught up to Underground NYC and their intense movitivation to start their own brand.
Yet, there was a demographic that was. College students.
How were we going to scale this new magnificent product?
At the time, people hadn't quite caught up to Underground NYC and their intense movitivation to start their own brand.
Yet, there was a demographic that was. College students.
Here I've used a child theme in Wordpress, in order to build a real prototype of a gamification system for reps to sell Apliiq apparel through their own streetwear brand.
Here I've used a child theme in Wordpress, in order to build a real prototype of a gamification system for reps to sell Apliiq apparel through their own streetwear brand.
Here I've used a child theme in Wordpress, in order to build a real prototype of a gamification system for reps to sell Apliiq apparel through their own streetwear brand.
Gamification
I was able to use Achievements Plugin for Wordpress in order to add Gamification to the rep program. This gave all reps an incentive to compete against one another in effort to sell the most apparel.
What we see in the left, is the leaderboard. Notice how more than one rep was able to increase revenue by $3K+ within a months time. So, those points on the left, they're equivalent to dollars per month.
I was able to use Achievements Plugin for Wordpress in order to add Gamification to the rep program. This gave all reps an incentive to compete against one another in effort to sell the most apparel.
What we see in the left, is the leaderboard. Notice how more than one rep was able to increase revenue by $3K+ within a months time. So, those points on the left, they're equivalent to dollars per month.
I was able to use Achievements Plugin for Wordpress in order to add Gamification to the rep program. This gave all reps an incentive to compete against one another in effort to sell the most apparel.
What we see in the left, is the leaderboard. Notice how more than one rep was able to increase revenue by $3K+ within a months time. So, those points on the left, they're equivalent to dollars per month.
With the recent success of our crowdsourcing efforts with Apliiq Campus. We noticed alot of users were going from the Apliiq website to IndieGogo or GoFundMe to fund their brands. So, we decided to build our own crowdfunding platform dubbed, Apliiq Campaigns.
With the recent success of our crowdsourcing efforts with Apliiq Campus. We noticed alot of users were going from the Apliiq website to IndieGogo or GoFundMe to fund their brands. So, we decided to build our own crowdfunding platform dubbed, Apliiq Campaigns.
With the recent success of our crowdsourcing efforts with Apliiq Campus. We noticed alot of users were going from the Apliiq website to IndieGogo or GoFundMe to fund their brands. So, we decided to build our own crowdfunding platform dubbed, Apliiq Campaigns.
With the recent success of our crowdsourcing efforts with Apliiq Campus. We noticed alot of users were going from the Apliiq website to IndieGogo or GoFundMe to fund their brands. So, we decided to build our own crowdfunding platform dubbed, Apliiq Campaigns.
Right out of the gate our new product launch was a great success. With the Beanie Sanders Campaign successfully funding. This, among others, proved the value of crowdfunding and crowdsourcing together.
Right out of the gate our new product launch was a great success. With the Beanie Sanders Campaign successfully funding. This, among others, proved the value of crowdfunding and crowdsourcing together.
Right out of the gate our new product launch was a great success. With the Beanie Sanders Campaign successfully funding. This, among others, proved the value of crowdfunding and crowdsourcing together.
Right out of the gate our new product launch was a great success. With the Beanie Sanders Campaign successfully funding. This, among others, proved the value of crowdfunding and crowdsourcing together.
Lessons Learned
I was thumbing through FlipBoard at the time, when I happened upon this ad by SAP.
This ad has stuck with me since, and has really rang true.
With Apliiq, I learned first hand, we've got to let go of legacy user interface, because it complicates things. We end up bug fixing and rigging things together just to work.
It's best to start out fresh, with a clean slate, and ask the 5 "Why's" on new projects. This is crucial to Design Thinking.
I was thumbing through FlipBoard at the time, when I happened upon this ad by SAP.
This ad has stuck with me since, and has really rang true.
With Apliiq, I learned first hand, we've got to let go of legacy user interface, because it complicates things. We end up bug fixing and rigging things together just to work.
It's best to start out fresh, with a clean slate, and ask the 5 "Why's" on new projects. This is crucial to Design Thinking.
I was thumbing through FlipBoard at the time, when I happened upon this ad by SAP.
This ad has stuck with me since, and has really rang true.
With Apliiq, I learned first hand, we've got to let go of legacy user interface, because it complicates things. We end up bug fixing and rigging things together just to work.
It's best to start out fresh, with a clean slate, and ask the 5 "Why's" on new projects. This is crucial to Design Thinking.
Secondary Visual Design Research
In this video, you can see how I applied the secondary visual design research, from the above references, to the visual design of the software product and intended physcial product itself.
In this video, you can see how I applied the secondary visual design research, from the above references, to the visual design of the software product and intended physcial product itself.
In this video, you can see how I applied the secondary visual design research, from the above references, to the visual design of the software product and intended physcial product itself.
Selected Works
Artificial Intelligent Chat Bot For People 50-plusArtificial Intelligence Design Research | AARP
How to increase user engagement with UX writing.UX Writing CyberSecurity Legal Innovation |CYBERLUCENT
Crowdsourcing Data Science Designing SearchMachine Learning Society & CO
Increasing Engagement Amongst StakeholdersThe Design Lab at UCSD
Guerrilla Field Research For Anticipatory Design Increases DelightC2Group| SDG&E | Construction Management
Heatmap Analysis of Unmoderated Test Increases ConversionHeroX, PBC | XPRIZE Foundation, Inc.