Powered by
  Joel Lueders
Picture
Picture
National Guard Logo
Greater Twin Cities United Way Logo
favicon.ico
File Size: 15 kb
File Type: ico
Download File

Picture
Usability testing
journey map
Survey
What are the reasons people give when they volunteer and what are their excuses when they don't? Using Optimal Workshop we asked 111 Twin Cities residents the following questions:
​
1. What is your age?
2. What is your gender?
3. What is your employment status?
4. Where do you live?
5a. Do you volunteer?
5b. Why or why not?
6. How often do you/ would you be willing to volunteer?
7. (If applicable) Where have you/ do you volunteer?
8. How did you find these opportunities?
9. What causes do you care about?

​Key Insights:
  • Most people volunteer because they are morally inclined
  • They volunteer for a huge variety of causes
  • Most people don't volunteer because they don't have time
Card Sort
User testing of the Volunteer United website showed that new users found the number of causes and skills to choose from daunting. To lower the cognitive load a card sort was performed using Optimal Workshop surveying 9 potential volunteers. They were asked to categorize the causes and skills. They were also asked to name these new groupings.
  • Reduction in cause categories from 29 to 8.
  • Reduction in skill categories from 28 to 5.
Dating app Competitive audit
Picture
⃠ Match.com: Requires too many (50) questions upfront.
Picture
⃠ eHarmony: The sophisticated algorithms are outside our scope.
Picture
✔ HiDine: Matches you based on restaurants you like.
Picture
✔ Tinder: The UI is easy and fun.
Key Insights:
  • Use Tinder's UI as the skeleton for our app.
  • ​Design a recommender system similar to HiDine by matching two parties with a third thing.
Recommender system
Picture
The Sources of Motivation by Vega Factor
Play type is the most motivating so it should have the most points when there is a match, followed by a cause match, then a skills match. I tested this out several times and  am happy with Five points for a play match, two for a cause match, and one point for a skills match. This is because since volunteer opportunities can list many skills and causes. This point value seems to balance that out, but this needs to be tested.
Play Types
I illustrated the eight play personality types from Stuart Brown's book Play for use in the Prototype.
Wireframes


​Featured Work

​
​Graphic Design & Military Background

Hi, I'm Joel. I'm a UX designer and host of the UX Whiteboard Challenge Meetup where strangers solve problems together. For a meetup, it's actually a lot of fun.

​My background is super diverse. I went to art school for graphic design, then left to study astronomy and join the military. They taught me to become an industrial machinery mechanic and how to manage my ego and a team.  The military is actually pretty great.

Because I love science communication, I earned a bachelors degree to teach it in middle school from the University of Minnesota. Then, supervised a call center during a major software upgrade, waited tables in Yellowstone National Park, and drove a big red Peace Coffee van while delivering to grocery stores and restaurants around the Twin Cities. All the while designing album covers
, posters, jigsaw puzzles, and websites on the side. I've hosted over a hundred hours of podcasts, and performed on stage in front of thousands of people.

Most recently, I discovered UX and finally found a field which pulled all of these loose ends together. I attended Prime Digital Academy's UX Design bootcamp, was awarded second place at the Twin Cities Startup Week's AI Hackathon, and have been working freelance ever since. It's pretty great.

COFFEE GRINDER (BULK) CUSTOMERS

Ethnographic Study

Prototype

Picture
Grinder Customer Tool Kit Prototype 1

STORE CUSTOMERS 

One of Peace Coffee's goals is to inform the public about Climate Change and the effect on farmers. How do we address this in a grocery store in a natural way? How do we create the space for this, both physical in the store and mental in the customer's minds?
Peace Coffee and it's customers value the environment this is shown in the following customer touch points: Bike delivery, biodiesel van delivery, wording at bulk bins, wording on package coffee bags. What more can they do? They could switch to recyclable or biodegradable packaging. Such a dramatic shift from a premium organic coffee company would highlight how much they care about the environment and create a space to talk about how climate change harms their supply chain. What else could be changed to achieve the goal of informing the public about how Climate Change is impacting coffee farms?

Display Supply Chain Information

On bulk bins there is space available to add cards. These cards could explain how the supply chain works. They also could have photos of the coffee farms, explain how climate change is hurting them, and link to find out more. Finally, if Peace Coffee were to switch to a different style of packaging this area could be used as advertisement.

Climate Change Website Wireframe

The website would address three things:
  • This is the problem.
  • This is how we interact with the problem.
  • This is what we can do about it.
Picture

MOVING FORWARD

Recommendations
  • Improve packaging by adding roast level and flavor descriptions to the front of the bag.
  • Add a tool set consisting of a brush, a pen, and safety scissors, to every store where there is a grinder.
  • Print cards to attach to the front of the bulk coffee explaining the effects of climate change and educating customers on the supply chain.
  • Create a website explaining the climate change problem and how Peace Coffee interacts with this problem.
  • Redesign packaging to make shopping easier.
  • Add a set of tools to make grinding coffee a better experience.
  • Use available space on the bulk bins to educate customers about the supply change and how climate change impacts coffee farms.
  • Create a website detailing where Peace Coffee fits in the climate change issue.

​

Hello, I'm Joel.

I am an outgoing, positive person who is good at drawing the best out of people. 

Here you'll find three client case studies and one about a hackathon.

​As you'll see, I love to jump in and learn new things, analyze problems, and build solutions.

Hamburger Menu

Learn about my popular UX whiteboard meetup.
See past visual designs and illustrations.
Watch videos I've helped to make.
Read articles I've written about UX and design.

A Tale of Two Prototypes

We proposed two potential apps to our clients.
Picture

Volunteer United App

This app focuses on streamlining the Volunteer United experience. It would do this by replacing the keyword search with a list of causes and skills to choose from.
​
The recommender system works by assigning points to matches between the volunteer and the opportunity.
Matching causes are worth 2 points, matching skills are 1 point. The results are weighted in favor of causes because if you believe in something you'll be more willing to help out.
Picture

Personality Test App

This app focuses on telling the user about themselves. It uses a casual friendly tone. It determines the causes users believe in and their play type using multiple-choice questions.

The recommender system works by assigning points to matches. We weigh the results in favor of play type. If you find something fun you're more likely to do it. Matching play type is worth 3 points, matching causes are worth 1 point.

Client's response, "Can you combine them?"

​Yes.

​Hi, I'm Joel and it's a pleasure to meet you. I love UX Design.

When designing anything these are the questions I ask:
  • Who will be using this?
  • How will they be using this?
  • Are they already familiar with something similar?
  • What should it look like?
  • What kinds of feedback should the user receive?
  • How is it monetized?

My unique background helps me to understand people. I've worked as a
  • School teacher
  • Haunted house actor
  • Waiter in Yellowstone National Park
  • Call center team lead
  • Illustrator
  • Soldier

​If you're in the Twin Cities check out my hands-on UX meetup.

Climate Change Website

A mobile app for a tech company to schedule conference rooms.
A mobile app to help delivery people take orders quicker than current apps.
An app for volunteers to find opportunities that match their play style.
Improving store experience by redesigning packaging based on user tests.
A website for teachers and students to reserve equipment and computer labs.
An online service to help aqua therapy patients save money by connecting them with cheaper hotel and residential pools.
A water bottle for full stack developers.

Client Websites

Websites created for clients using the Weebly site builder and custom HTML and CSS.
Screen shot of brianjust.com. An illustration of a yard sale with . the words Changing Traffic Lights superimposed.
Screenshot of Reach Higher Painting and Drywall's website. An illustration of a blue Victorian house and the words
Case Study
Screenshot of Nano Nore Art website. Many colorful paintings and bold printmaking prints of boats and chairs.
Screenshot of Rachel Mayer Art selling papercutting.

Side Projects

Working side-by-side with a diverse team of developers and designers is enjoyable.

Picture
I Know When You're Going To Die
Using the deep learning Nexosis artificial intelligence API this webapp predicts when you are going to die. Second place winner of Twin Cities Startup Week Hackathon. Built with Hogan McDonald.
Case Study
Picture
West Bank Events
This is a website for music enthusiasts who live in the West Bank region of Minneapolis. It automatically generates a calendar of events. Built with Peter Wildberger.

Picture
UX Whiteboard Challenge Meetup Group
I started a meetup group so designers of all skill levels can come together and do fun hands-on activities together. We aim for peer learning, support, and friendship. This is a good way to build confidence in your problem-solving skills. As well as get ready for a big meeting, or practice for interviews.
Picture
UXWBC Mission Statement
Using JavaScript, this site randomly generates variations of my meetup's mission statement.
joel_lueders_ux_ui_designer_resume.pdf
File Size: 67 kb
File Type: pdf
Download File

Visual Design

Picture
User Interface
x

User Interface

001 Sign Up Page
Sign Up Page
002 Credit Card Checkout
Credit Card Checkout
003 Landing Page
Landing Page
vintage calculator
Calculator
Icon with the letter J made out of colored blocks and an iPhone X with the icon on the homescreen
Icon
Hand holding an iPhone X with the app that says Orange Thomas, Theif, and you have the option to hire him.
Profile
cartoon style game settings panel
Settings
404 Page with image of a UFO abducting a webpage. The words "abduction warning! there have been 404 reported sightings."
404 Page
Music Player inspired by 1980s boombox.
Music Player
Tombstone that says "You will die 10:55pm Mon November 14th 2061 age: 81" with a speech bubble that says "send funeral invitations" pointing to share icons.
Share Buttons
Error and Success messages with happy and excited cartoon cupcakes.
Error & Success Messages
Donut subscription service. Motion Graphics, Animated gif alternating between different types of donuts
Single Item Page
Chat window mockup for this website.
Direct Messaging
Countdown timer a minimalist hourglass with falling red squares
Countdown Timer
On and off Switch that resembles light switches
Off/On Switch
Picture
UX Deliverables
x

Experience Mapping

Persona and User Journey Map
Service Blueprint for NonProfit
Persona and Journey map

User Flows

Subscription Service User Flow Map
User Flow Map demonstrating shortening
User flow map of the experience of looking at other designer's user flows. Comedic.

Wireframing

Low Fidelity Wireframe of  this website.
Low Fidelity Wireframe for a mobile app
Wireframes for product packaging

Prototyping

Screenshot of a prototype from Sketch of an Android App for delivery persons
Prototype of a calendar webapp created in Sketch
Demonstration of user interaction in iPhone app.

"I don't care about what anything was designed to do, I care about what it can do." - Apollo 13 (1995)

Picture of Joel in a UFO.

Imagination

Is your team stuck and can't find their way out? You need a designer with a keen imagination to pilot you through unknown skies.

Storytelling

Is your company having a hard time grasping the full picture? You need a storyteller who can show how everything is connected.

Energy

Could your team use a burst of energy to get things buzzing again? You need a teammate who spreads joy and enthusiasm.
joel_lueders_resume.pdf
File Size: 46 kb
File Type: pdf
Download File

joel_lueders_ux_designer_resume.pdf
File Size: 32 kb
File Type: pdf
Download File

joel_lueders_visual_ux_ui_designer_12jan18.pdf
File Size: 66 kb
File Type: pdf
Download File

joel_lueders_ux_designer_08dec17.pdf
File Size: 66 kb
File Type: pdf
Download File

joel_lueders_ux_specialist.pdf
File Size: 66 kb
File Type: pdf
Download File

Expand - peace coffee case study

Client

Peace Coffee is a medium sized coffee company that creates a premium coffee and values paying organic farmers beyond fair trade prices. They value the environment demonstrated by delivering their coffee by bicycle and biodiesel van. The majority of their sales are wholesale (selling to local grocery stores). They are expanding to the greater Midwest with partnerships with Target and Hyvee. 

Disclosure: I previously worked for Peace Coffee for 5 years as a delivery person, a production assistant and I named the Morning Glory coffee blend.

Challenge

  • Improve the in-store shopping experience
  • Increase transparency around the impact that climate change has on our supply chain.
  • Increase customer understanding about our supply chain.

Field Study

First I visited a local Target to see if they were in stock. They were not for sale at this Target store. They are only available at Target stores that have an organic section. While there I looked around at the packaged coffees to look at the competition. 

After Target I visited a Seward Community Co-op, I knew that this store is one of Peace Coffee's biggest accounts. While there I interviewed three bulk coffee customers.
Target Coffee Aisle
Target Coffee Aisle

Target Store

Target - 2500 E Lake St, Minneapolis, MN 55406
Target, 2500 E Lake St, Minneapolis, MN
  • Only national brands available (No Peace Coffee.)
  • Average cost around 6 dollars
  • The only organic and/or fair trade coffee is their private label
  • "Premium coffees" (caribou, starbucks, peets) all in plastic-foil "tin tie" bags.
  • Cheaper coffees (folgers, cafe bustelo, maxwell house) in plastic tubs or steel cans.
  • Roast level displayed on the front.​

Seward Community Co-op

Picture
Seward Community Co-op, 2823 E Franklin Ave, Minneapolis, MN
  • Large bulk section, small bagged section (all plastic tin-tie bags)
  • Peace Coffee beverage available for sale in Deli.
  • The Co-op emphasizes the bulk coffees on the grounds of: Fair Trade, Locally Roasted, and Co-op Owned.
  • The Co-op's description of Peace Coffee, "Peace Coffee produces organic fair-trade coffee that preserves and protects the environment and sustains the livelihoods of the people who grow, roast, and sell it."​

User Interviews at Seward

While at Seward Community Co-op I asked three people why they were buying that particular coffee and why in bulk:
Participant 1. Driftless, Medium Roast -
"This makes the best cold press coffee. I'm grinding it into a mason jar so I don't waste a paper bag".

Participant 2. Peace Coffee, Decaf Dark -
​"This is for my mom, it's the only coffee she'll drink. I always buy in bulk, it's better for the environment and I can get as much as I want. I don't want a lot of decaf because it's only for my mom."

Initial Synthesis 

Peace Coffee and it's customers value the environment this is shown in the following customer touch points: Bike delivery, biodiesel van delivery, wording at bulk bins, wording on package coffee bags. What more can they do? They could switch to recyclable packaging. Such a dramatic shift from a premium organic coffee company would highlight how much they care about the environment and create a space to talk about how climate change harms their supply chain. Additionally a new package would change the in-store experience. What else could be changed to improve the in-store experience?

The Plan

Picture
Three User Groups: 12 oz Packaged Customers, Bulk Customers, All Customers

Competitive Analysis of Coffee Bag Features

I visited the grocery store and compiled a list of features from the front of coffee packaging as well as different types of packaging materials. My plan was since I'm proposing to change the bag material, what else about the bags can be changed? Is the information on the bags, the information the customer desires? What information does the customer desire?
​
Coffee Label Features
  • Roast Level (light, medium, dark)
  • Roast level on a scale (1-10)
  • Whole bean/ground
  • Origin source
  • Flavor description
  • Premium
  • Fair trade certified
  • Organic certified
  • Rainforest Alliance certified
  • Acidity level
  • Body description
  • Brand Name
  • Roast Date (when was it roasted)
  • Supply chain details
  • Climate change impact on supply chain details
​
Packaging Types
  • Resealable
  • Tin tie closure
  • Recyclable packaging
  • Biodegradable packaging
  • Poly-foil bag
  • Metal can
  • Plastic packaging
Competitor Examples

Kano Survey & Ranking of Coffee Bag Features

Forty-four participants who identified as making coffee at home were surveyed. Two questions were added to specifically address Peace Coffee's desire to educate the public about the coffee supply chain and the effects of climate change on the supply chain. The results have been ranked by most desirable to indifferent followed by the Kano score out of 44. (The scores were calculated by adding together Mandatory, Linear, and Exciter.)
Coffee Label Features 
  1. Roast Level (40)
  2. Whole Bean/Ground (37)
  3. Fair Trade (36)
  4. Origin(34)
  5. Roast Date (29)
  6. Flavor description (28)
  7. Organic (28)
  8. Rainforest Alliance certified (24)
  9. Supply chain details (19)
  10. Roast Level 1-10 (19)
  11. Climate Change impact on supply change details (17)
Packaging Types
  1. Recyclable (37)
  2. Biodegradable (34)
  3. Resealable (32)
  4. Plastic (24)
  5. Metal (17)
Kano Survey of Coffee Packaging Features
Kano Survey Data

Packaging Wireframes

Wireframes of proposed packaging
Wireframes of proposed packaging.

Participant Led Usability Testing

Methodology

Participant Led Usability Research is a method developed by Christopher Stephan and Nick Rosencrans where instead of walking the user though pre-scripted steps, the user creates the task themselves and solves it their own way. The goal is to discover the mental models of the customer as they are choosing a coffee that meets their specific desires and to compare the experience between the current and new packaging.
​
The participants self-identified as having previously purchased coffee from grocery stores and signed a consent & recording release form. They were asked to write down 3-5 characteristics they look for when shopping for coffee. Next they were led into the testing chamber and shown either an assortment of the current or the new coffee bag designs.

The coffee bags were arranged at eye level as they would be found at most wholesale retailers. Participants were asked to approach the display as they would at a grocery store and to locate a variety of coffee that meets their first characteristic they wrote down. Then they were asked if the variety they choose met their second characteristic, if yes, then we moved down the line to their next characteristic. If they answered no, then they'd be asked to choose which variety would they buy instead and why?

Results

Picture
The Current 12oz Label- "At my Co-op, I get bulk beans and it says [the roast level] on there."
  • Roast level was important to the participants.
  • When given the bag participants were unable to find the roast level on the back.
The Proposed 12oz Label- "I actually love this! It says the roast right on top."
  • Positive verbal reactions to prominent roast level display. They were able to locate a variety fitting their desired preferences faster.
  • Positive reaction to roast date being shown, "you never know if it's 2 weeks old or 9 months and that's important."
  • Participants without a specific preference used the flavor description to aid in choice. 
  • No comments on the biodegradable logo. After the test, five participants were asked what they thought the symbol mean and none of them knew it meant biodegradable. One person said it was the wrong symbol. She was right. The new design should switch to a more standard symbol.
  • One participant thought that roast level and roast date should be next to each other.

Packaging Recommendations

  1. Add roast level to the front of the packaging - The current packaging met most of the customers written desired characteristics. However during the testing, whether the participants had written it down or not, roast level came up as a deciding factor in 5 of the 6 trials. 
  2. Add flavor description to front of packaging. - All participants commented favorably to the descriptions on the front of the bag.  Notably one participant who doesn't drink coffee, but buys it for her household remarked that she liked knowing what tastes her family was experiencing when they drank the coffee. 
  3. ​Test user's reaction to biodegradable packaging. - Update the bags with the standard biodegradeable logo and conduct a desirability test.
Picture
Recommended Packaging
joel_lueders_-_ux_designer.pdf
File Size: 53 kb
File Type: pdf
Download File

joel_lueders_simple_resume.pdf
File Size: 187 kb
File Type: pdf
Download File

Picture
Picture

Podcast XML File

favicon2.ico
File Size: 19 kb
File Type: ico
Download File

tibbles.xml
File Size: 58 kb
File Type: xml
Download File

Current Podcast Icon

Picture
Picture
Picture

Previous Podcast Icon

tibblesskyscraper300.jpg
File Size: 38 kb
File Type: jpg
Download File

tibblesskyscraper144.jpg
File Size: 14 kb
File Type: jpg
Download File

tibblesicon300.jpg
File Size: 63 kb
File Type: jpg
Download File

tibblesicon144.jpg
File Size: 24 kb
File Type: jpg
Download File

Picture
Picture
Picture
Picture
Picture
Picture
jfavicon.ico
File Size: 15 kb
File Type: ico
Download File

Powered by Create your own unique website with customizable templates.