CodeForCash — Part 2
Thanks for tuning back in! If you haven’t already read part 1 https://medium.com/@Awesometimes/codeforcash-575184280f31, I would suggest giving that a read.
The game can be found and downloaded on the Apple App Store: https://itunes.apple.com/us/app/codeforcash/id896367987?mt=8
In this portion, I’ll mostly be talking about how I found my designers and my thought process on how I came up with the ideas and images that are in the game now.
Preparing For The Uphill
As mentioned in Part 1, I had just finished up the basic controls and layouts of what I thought the game should look like. I knew, however, the bread and butter of this game would be the tongue in cheek images. I had a handful of ideas written down on a piece of paper, but the ideas were all over the place. Also, unfortunately, I didn’t have a lot of skill in photoshop or the ability to create my own image assets. I had to think about where I would be able to find creative designers that would create these images for me. I knew also, once I found then, I had to be very specific in terms of what I envisioned.
I thought about my inner circle of professional designer friends and reached out to them. I sent an E-mail out to a few of them telling them about my game and if they would be interested in creating these assets for me or know anyone that would or websites that had services that met what I was looking for. I also stated that that I would create mockups and would be happy to pay for their time. In parallel, in the event they all declined me, I started googling around for external services that allowed me to connect with designers. I found sites such as 99 designs, Dribble and Fiverr.
Dribble is a site that allows designers to showcase their work, and on the flip side, people looking for designers can ask them their as well. I didn’t want to dish out an arm and a leg, so I decided to look else. Same with 99 Designs, you pay a decent amount of money, but you’ll have a bunch of designers create designs for you and you get to choose the one(s) that you like. I needed something more simple.
Thankfully, I haphazardly stumbled onto a website called Fiverr. For $5, someone will do a service for you. Whether that’s proof reading someone’s paper, creating a video commercial for you, or most important, having someone do graphics design work for you. It’s a pretty cool site and I highly suggest it if you’re looking for designers or sound engineers.
I started browsing around on Fiverr under their ‘Graphics Design’ section and looked for people that had a cutesy art style. I found a few and contacted them inquire more info. Tried some out, but either they weren’t very good or they wanted me to pay extra for things such as copyrights to the image I was requesting for (which is dumb). There was one guy, by name of ignacio_9, that I ended up working with extensively, but I’ll get into that a little bit further.
I remember it was a clear sunny Sunday afternoon, going to brunch, I had checked my E-mail prior to going in the restaurant I was dining at, and lo and behold, I had heard back from a couple of my designer friends. I was a little nervous at first to see their decision, as if they both said ‘no’, this game probably would not have seen the light of day or it would have cost me a lot via Fiverr. As I read their E-mails, I remember the sun had shined on my face; they replied back saying ‘yeah!! This sounds cool and fun, I’m in’ (paraphrased). I lit up a cigarette with a big smile and also had a sigh of relief.
One of my designer friends introduced me to my first designer, friend of a friend, Ken; he was ready to start whenever and the other one, Katelyn, said to give her a couple of weeks so she could wrap up some other work. No problem, I said. I knew now, that I had to get the ball rolling on working on mockups for Ken to work on, if I wanted to get this done in a timely manner. In my original E-mail, I said I’d like to get this game out into the App Store within a month (it took a total of 3 months).
Let’s do it.
That night, I sent Ken an E-mail with more info, logistics of how I wanted things to go. We also agreed on a strike price, $5/image that he provided. Not a problem, same as Fiverr, but at least this was a guy I could trust. We started off with a few trial mockups from the ‘Hardware Upgrade’ section to see if his style matched my vision of the game. I created a google doc and put in the following columns:
- Upgrade Item — Name of the image I wanted; e.g., Monitor, memory, cable modem etc
- Envision — What I pictured in my head; e.g., the dial-up modem, the envision row said “old school rotary phone with some action that it’s being ‘dialed’ connecting to the internet (maybe a cloud in the background)”
- Image Similar To — What I found on google of what I wanted it to look like if it was too hard to describe
- Status — For the designer to mark if the image was completed, in progress or not
- Comments — In the event any questions came up
I told Ken that I wanted my images 60 points (i.e., 60x60 pixel (non-retina) and 120x120 pixels (retina)). That was just a size that I guessed my UIImageView would be. It worked out. I told him that he could provide me just the .PNG or if he really wanted to, the vector file. I also mentioned to him that, if needed, I could hand draw a mockup if things were still unclear. Thankfully, I didn’t have to do much of that until later.
A week went by and I saw the first initial batch of items from Ken. I was very pleased with them, so we didn’t have to do much revision-ing. I wanted him to feel like he had absolute creative control, which was true. I kept insisting, here’s my vision, but feel free to add or change up whatever you like. This worked very well for us. For example:
- [Name of upgrade] : [What I described]
- Motherboard: “cartoon’ish motherboard”
- Memory: “should look like a stick of memory”
- Power supply: “power supply with a lightning bolt on top or something”
After the first batch, I threw in more hardware upgrade image requests in the google doc for him to work on. This process went on over a month. I had realized halfway through the month, that it took longer than expected to get these images completed, so I knew I had to parallelize the design work, again, if I wanted to complete this game in a timely manner. I quickly realized that 1-month was not achievable, but I was still optimistic about getting the game completed.
In terms of development for the game, like any project, you struggle here and there. I had to work after work, during the weekend, anytime I could get for free, I worked on this game. Initially, I tried going to coffee shops & cafes to focus, as working at home, I just didn’t have the discipline (i.e., I’d get easily distracted and just waste time). Same with after work, I went straight the library to work for an hour or two, when I could. It was tough. I had to dig deep; especially after a long day at work and when your coworkers ask you to go out drinking.
I knew I needed around ~60–80 images done for me for this game. Since Ken was busy cranking out the hardware upgrades, I started getting in contact with ignacio_9 on Fiverr. I decided to have him work on the ‘Software Development’ upgrades. The software dev upgrades, in my opinion, had the most creative thoughts put into them; a lot of them had to do play on words, or tongue in cheek, so I had to think extra hard and had a high chance of going through multiple revisions.
Working with someone you’ve never worked with, let alone through a service you’ve never heard of prior, you have to first have to take a risk, as they could be terrible or just don’t match your style. You have to be very specific about what you want; you’re pay someone for a specific skill and not for the vision or creativity. I asked ignacio_9 to do some trial images, similar with what I did with Ken, to see if we’d hit it off with my vision and his style.
I said the following:
one of my software dev upgrades is called ‘automation’ i envision a robot of some sort. please create something similar to glados.
please have the following:
background color is clear color
120x120 pixels
white bordered outline
.PNG format will be fine (and .SVG if that’s convenient)let’s start with 1 and go from there! please let me know if you any other questions.
I was immediately impressed, I liked his art direction. I started to give him a few more 2–3 image requests every day. He was very prompt about it. Within a day he would have these images completed and would ask if I needed any revisions. Thankfully with him, revisions didn’t happen often as I was usually pretty specific on the idea that I wanted and also included a hand drawn mockup.
Here were some examples that I had requested and here are some of the outcomes:
this time i’d like an image of a boat sailing with a message bubble on the side that says ‘Ship it!’. i have sketched what i envisioned, but feel free to let your creative take over.
i’d like an image of a notepad with a graduation cap on it. this is to show that it’s ‘smart’. feel free to get creative with it (e.g. putting glasses on the notepad etc)
i’d like an image of a broom (similar tohttp://www.pankajbroomsindustry.com/Broom_icon.png) that’s sweeping up spaghetti from the ground. feel free to throw in a meatball or 2 if you want
1st request -
could you please create me an image of a tree branch (similar to this -http://www.clipartbest.com/cliparts/aie/peE/aiepeE4i4.jpeg) and in the center branch please have it say ‘master’ [attached]2nd request —
an image with a waterfall (like this — http://www.fedupusa.org/wp-content/uploads/2014/04/Waterfall.jpg) and then a fight bubble below it (like this -http://aaronsinternetwhispersblog.files.wordpress.com/2011/11/fight_cartoon.jpg) [attached]feel free to get as creative as you like for the fight bubble. you can have computers flying out, binaries 1's and 0's, running sneakers
i’d like an image of a cake similar to this:http://www.mikebernat.com/images/cake/layercake.png
the one to the right that says ‘Good Cake’the bottom layer is thicker than the middle and top layer. i’d like the words in the cake as show in my image [attached]. feel free to make the cake as decorative as you like!
Great. Now I had my ‘hardware’ and ‘software development’ images being worked out, I still needed to work with my last designer, Katelyn, to work out the ‘crypto-mining’ images. She had asked to see several images that Ken and/or ignacio_9 had done, so she could get her style aligned with theirs. I sent her some images and then told her I would send her what I had imagined for these images.
Using what I had learned from working with Ken and ignacio_9, I knew the more specific I was, the better the outcome. I created a google doc sheet that I had did with Ken and also hand drew out all the images that I wanted, similar to what I had done with ignacio_9. Fun fact, is that I did not know much about crypto-currencies, such as bitcoin, or how it all worked. I did some research and based on what I read up on or asked people about, I tried to create upgrade ideas for those.
Here are some of the hand drawn mockups that I gave for Katelyn:
And here are some of the results:
After months wearing multiple hats: the designer, coder, the vision, the copy, the tester, the cryer — things started to come together.
Sweet! Now it was all starting to come together. The game started to look slightly presentable, but I knew the hard part was awaiting me around the corner — the last 10%, the polish. I had to continue to crunch down on fixing bugs, polish up any dull edges, get whatever remaining images that I needed, and other semantics.
The uphill run was done, now I needed to finish strong.
—
That’s it for this portion. Thanks again, for reading. I really do appreciate it! In my last section, I’ll talk about the semantics. The painpoints of what I went through and what I needed to do to get this app in to the app store as the 1.0 release such as what needed to be in the first version and what features could wait.
