Published on <a href="http://ift.tt/2sD4L8I">| Prototyping: From UX to Front End &mdash; Medium</a> Michiko Rinaldo 
This project was to design a product that helps you become a better version of yourself. I wanted the end result to be about working with people, and while trying to come up with a solution for this I realized that to be able to work well with other people, you have to be aware of yourself. Being more aware of what you’re experiencing is the first step to understanding why you feel that way and then figuring out how to deal with it. For me personally the more I understand about myself, the better I can understand other people. I wanted to train myself to check in and think about what I’m feeling, in a way that wasn’t a pain in the ass, or boring so I’d actually want to do it. I wanted the user to be able to express their own personalities and the complexity of their emotions (which I think many apps leave out). Also if I could make it amusing that would be a bonus, things feel like less of a chore if you enjoy doing it. I settled on an automatic planter that takes care of your plant when you check in with yourself.
<img alt="" src="http://ift.tt/2tAXd3w">
The shape of the planter could be anything, and I could have designed a pot that would be ideal for the interactions, but it seemed more fun to put limitations on myself and see how I would deal with them. So I used the only white pot that I could find at Home Depot that was about the right size of a pot that you would put on a table. That’s how the Kee planter got it’s curve, because Home Depot didn’t have any flat ones.
My original plan was once a day when the user was close to their planter they would have to express their mood. At the time I figured I only needed a planter, since that’s where you would be recording your mood; and a website, to look back at your history.
What’s the meaning of the color — a project I worked on the previous year, dealt with using color to express emotion, since color has strong emotional ties, has a large scale of tints and shades and easily personalized for the user. (They themselves choose what the color red means happy, angry, in love, or all three at once). But also the weight of the line. What’s the difference between using a bold heavy line, or a thin delicate line, does it represent intensity of the emotion or the boldness of their personality. I wanted to design a way of recording emotion that was flexible and expressive all different users.
I tried it on myself to make sure I’d actually gather some interesting information at the end and to see what it would be like for the user to go through similar motions.
<img alt="" src="http://ift.tt/2sDaF9P">
I originally started out recording once a day, at the same time, like I planned; but I noticed unless something big happened, I felt about the same for each time of the day. Pretty good in the morning, either great or bad in the afternoon and then just fine at night. Since depression can be cyclic if I only record at one time of the day, like the morning, it’s very possible it would never show up in the data. From actually testing out the routine the user would take, I found a hole in my original data gather method. Which I fixed by adding recording multiple times a day. This meant that I needed to be able to input data in more than just the planter. I added in a simple phone and watch app to my system, to just be used for inputting data.
<img alt="" src="http://ift.tt/2tB0ks8">devices in system<iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fplayer.vimeo.com%2Fvideo%2F211213981&amp;url=https%3A%2F%2Fvimeo.com%2F211213981&#038;image=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2F627185963_1280.jpg&amp;key=d04bfffea46d4aeda930ec88cc64b87c&amp;type=text%2Fhtml&amp;schema=vimeo" width="1920" height="1080" frameborder="0"><a href="http://ift.tt/2sD54jY">http://ift.tt/2sD54jY</a></iframe><img alt="" src="http://ift.tt/2tBdvcO">user flow chart<img alt="" src="http://ift.tt/2sD6RWh">wires for a reminder and input on watch app
I’ve been looking for technology could be used to make this product into a reality. There are many self watering planters out, lots on Kickstarter, this is one of my <a href="http://ift.tt/2iIRdQA">favorites</a>. It would just need to be connected to wifi and the pot would work. <a href="http://ift.tt/29TKpxs">This one</a> is another one, that was actually designed to have an app along with it. Also looking into a touch display at the moment the <a href="http://ift.tt/2tANmLh">Samsung Gear Fit</a> has the look and curve that I’m looking for.
I discovered that I really enjoy UI animations. They blow my mind. They’re capable of conveying so much personality in something so simple. I was taking a history of animation class during this time, which helped fuel and explain these techniques. I wanted to use this to see if I could tell the story of Kee in the UI animations.
<img alt="" src="http://ift.tt/2sDk4hR">
<h3>Why not give the user a scale of emotions to pick from?</h3>
I had decided earlier that I wanted the user to be able to express themselves and their own personalities. I think giving users this level of personalization connects the user emotionally because it gives them a chance to express their mood and also their personality. There was also the idea of making it super simple which would encourage users to think of more creative ways to express, for example only black in a specific weight. I know for myself, I can express a lot of emotion through color and if I look back at the test I did, I take advantage of different weights often.
Right now, really stuck on how to make the experience of the app feel like the personality of the app.
<h3>Can I have the drawing tools open when the app is opened?</h3>
The two states of the landing page would be “creating” and “save”. Or else the landing page starts with an “inactive” state before getting into”creating”. Creating is primary so I’m going to put the drawing tools on the bottom?? and save/delete at the top because those are second. (I’m justifying this because messenger has their send on the bottom and drawing at the top, but their main goal is sending images, and mine is drawing, so I’m going to put that at the bottom.)
<img alt="" src="http://ift.tt/2tAJutC">
A better version of myself is found in staring at the same problem for hours, thinking out loud with people until something clicks and then making changes.
<img src="http://ift.tt/2sDk3dN" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="http://ift.tt/2tAMtSI">a better version of myself</a> was originally published in <a href="http://ift.tt/2cAqCpx">Prototyping: From UX to Front End</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

a better version of myself

Top Stories