Jack of all trades

By the time I graduated 3 years ago, I’ve already had an idea of what I wanted to be: a designer who could build stuff. This was my main motivation in learning how to design and code (not only javascript, but also to be able to build stuff from ground up, like Rails, so I could make prototypes and test my ideas).

Three years later, some of that have changed. I still wanted to build stuff and I’m still designing and coding, but I’ve valued teamwork a lot more than I did before. I haven’t yet built a product by myself, but I’ve worked on a couple with talented developers and it was a lot, lot of fun and usually a great learning experience. A lot of times though it feels like I’m a “jack of all trades, master of none”. I always read about mastering one thing, or developing strengths, and that trying to develop weaknesses is a waste of time. As someone who’s primarily a designer, I would view “coding” as a weakness, though I’m not so confident that I’m that great with visual design either. This leaves me feeling that I’m actually good at nothing, making me feel much more discouraged than when I just started to think about what the hell I’ve been doing.

This always made me question if I’m wasting too much time learning skills that I’ll never be good at anyway (I learned some Cordova in my last part-time job; we didn’t even finish that project so I only learned how to compile and use SQLite but that’s it. I’m actually not sure when I’d ever use that knowledge again). To quell this cognitive dissonance, I just tell myself that learning new things, no matter what they are, is good. I’ve attended JSConf Asia and felt inspired (to make stuff). I’ve attended UXHK and felt inspired (to spread good design thinking). But they haven’t really done much to convince me that I’m doing the right thing in building my career. I feel like I’m floating in between design, front-end, javascript, UI, UX, whathaveyou.

Recently though, a new job and a new project with a missing Product Manager, I’ve been forced to think about this new product we’re doing a LOT. In the beginning, it was just hard to design for something that I hadn’t yet fully understood: I didn’t know what the product’s goals were, what exactly we wanted to achieve after the MVP has been released. And even when the basic functionalities for this MVP has been laid out, I kept on thinking and thinking about our roadblocks and how we might overcome it. I’m supposed to be thinking about wireframes and flows and even branding, but I couldn’t help but brainstorm on what our new product needs so that it could work. The books I’ve been reading are related to design — but much less with just the visual design of things (i.e. UI), but more so on psychology and product development.

This made me go back to David Cole’s article on the web: Applied Discovery: Presentation Build from 2013. He’s a designer I admire a lot mainly because he seems to be the type of designer I want to be (a designer who codes). When I first read that article, I shared it everywhere. I shared it a lot. I just felt like it spoke to me on so many levels and made me feel like I still knew what I was doing. That hey, all the time I’ve spent trying to learn code instead of practicing more visual design wasn’t all for naught. And that all the roles I’ve taken on, and all that I’ve learned from past projects is movement towards the goal that I had from three years ago: to build stuff.

There’s a temptation, when your only domain is the interface, to look there to innovate…

This narrow view also threatens the ability to do our best work. Far too often, a designer is charged with designing a product that will never make sense when expressed in UI, and the feedback loops rarely move backwards to force the product to change in response to the interface. By owning both halves, each process can move in appropriate response to the other, ensuring harmony. This is also why I believe designers should code, but again, that’s another subject for another talk.

Here’s a question to ask yourself: if the project you were working on failed — it hit the market and nobody wanted it, nobody used it — would you blame yourself? If the answer is no, then I think you don’t have enough authority. If you’re blaming others for the outcomes in your work, it’s time to demand more.

Maybe it’s no longer enough for me to just be thinking in wireframes or design or front-end. Maybe it’s time to get dirty with designing what a product will be and even have more responsibilities tied to its success and failure. Maybe I have big ideas to contribute to product development or design, in conceptualization and implementation.

There have been some projects where my ideas were “advice” — not enough authority to push through with the released product because again, my role was mainly just on the UI and front-end side of things. Perhaps now is a good time to start doing more, as product design is just another part of what I need to build stuff. I just hadn’t really thought that hey, maybe this is also a path that I could take.

We’ll see.

 

Spark Camera on iOS (and circles on your interface)

Spark Camera is free on the iOS App Store for a while, so Charlie suggested that I download the app since it was really pretty for a video recorder+editor. I’m not used to taking videos, more less editing them, so I don’t think I did pretty well compared to Charlie’s tests.

It’s interesting because it seems like circles are slowly becoming more common in mobile UI (thinking about Paper’s undo function) and there are  cases where it works and it makes sense. Spark Camera also uses more gesture-based actions such as sliding to move from one screen to another, or for menus, and at first I would miss some things, but playing around with it twice I think gave me a good idea on how to do things.

Attractive UIs really help getting word out about your app. :P It’s actually very simple, and the videos filters are lovely (reminds me of Path filters).

Here are some screenshots of the app:

Resource sharing: a Design Basics module

This is a quickly-gathered list of topics and links to give a simple overview and some foundation of design. I originally shared this with my teammates, but I’m putting it here for anyone who might want to check the list out.

(This may not be the best list out there, but it is a quick overview or summary, if you wish, with the goal of pointing people towards the right direction.)

Design Basics

Intro to learning design – http://www.vanseodesign.com/web-design/learning-when-overwhelmed/

Design – Visual and interactive communication

http://nwrain.net/~tersiisky/design/design.html

Visual design elements

 1.line

 2.shape

 3.color

a.hue – pure state (red/blue/green, etc.)

b.value – lightness or darkness

c.saturation – (intensity or chroma) brightness or dullness

– saturation levels for screen and print are different. i.e. what looks bright on Photoshop may not print at the same level of brightness

 4.value (relative lightness or darkness) – adds volume, feeling, creates mood

 5.texture – surface quality, roughness or smoothness

Design principles

 1.unity

 2.variety

 3.emphasis

 4.balance

 5.scale

http://www.auburn.k12.ca.us/ev-cain/Teachers/Sarradet/Presentations/Art%20Principles.pdf

http://www.slideshare.net/mindartpower/principles-of-design-nf

http://markwmcginnis.wordpress.com/2010/10/09/design-the-parts-and-the-whole-chapter-11-unity-and-variety/

Gestalt theory

 1.closure

 2.continuance

 3.similarity

 4.proximity

 5.alignment

(Read all here: http://daphne.palomar.edu/design/gestalt.html)

White Space

http://www.vanseodesign.com/web-design/whitespace/

http://boagworld.com/design/why-whitespace-matters/

Typography

http://ilovetypography.com/2008/04/04/on-choosing-type/

http://markboulton.co.uk/journal/five-simple-steps-to-better-typography-part-5

Grid systems

http://www.markboulton.co.uk/journal/five-simple-steps-to-designing-grid-systems-part-1

Aesthetics

http://www.vanseodesign.com/web-design/meaningful-design-aesthetics/

http://www.interaction-design.org/printerfriendly/encyclopedia/visual_aesthetics.html

http://www1.coe.neu.edu/~yilin/IE7315_2010/Paper%20Review%20Schedule/Design%20aesthetics%20principles%20of%20pleasure%20in%20design.pdf

Book: Why we love to hate everyday things

some good ideas wither under bad execution

From a recent thread on the Philippine Web Designers group on Facebook, a site was brought to my attention: http://kristn.com/

I haven’t really browsed through the entire site yet. Upon landing on the page though, I had no idea what it was. All I saw was this sunshine of images I didn’t understand and promptly went back to the Facebook thread to ask instead what it was. I was redirected to this article on theBobbery, which had a brief synopsis:

Kristn is a new Lifestyle Assistant, an exciting project by TV5/Interaksyon. What is interesting about Kristn is how the platform will recommend content to users, based on how they use and interact with the platform. Kristn is still in Beta but the crew hopes to release the mobile applications in the next weeks. And Carlo reveals that the platform will soon also have a TV show.

Sounds great on paper, yeah? But the execution was horrible, not to mention very bad branding. “Kristn” — I mistyped it the first time, and if you’re building an online brand/presence, this can be a bad set-back.

If there’s anything I learned from Startup Weekend Manila last year (2012), your product’s name is important: how it’s spelled, if it’s easy to remember, if it’s easy to type. Before launching commute.ph, we were almost going to launch it as “komyutips.com”. The domain has already been bought, branding was done, and we thought the name was a creative version of “commuting tips.”

Except let’s face it, commute.ph is more direct to the point, foreigner-friendly, and less prone to spelling mistakes. (How would you tell a person to check out komyutips anyway? Go to komyutips.com, but use a “K” not a “C”. Sounds bad.) We were told about the bad branding by our mentors there, and even if we had to shell out more money for a new domain, try to wrack my head around some kind of temporary branding for the SW Manila presentation, and redirect customers from the old Facebook fan page to the new Facebook page, we decided to go through it. With new competitors coming up, I’m glad we did.

It’s same with “Kristn” — it’s not “kristin”, or a more popular spelling of the name. If someone told me to check out “Kristn”, how would they say it? “Go to kristn.com, it’s like kristine, but without an ‘I’ or an ‘E’.” That sounds bad too. It probably kept a few people away from your site.

Then again, the homepage tells me so little about what to expect or what it’s about, and doesn’t highlight what’s great in the site: its content. One of the articles that I checked out (or the only article I checked out, for now) was: 5 Things We Learned at Google Philippines Launch because it didn’t sound like the same old “Google puts up office in Manila” news.

So as a whole, Kristn seems like it had some solid idea behind it, and as Franky mentioned on the Facebook thread:

But they have a rather cool recommendation algo and then also check-in and other novel features upcoming.

Unfortunately, with their homepage so badly designed, and a name that doesn’t quite stand out like Rappler does, I feel apprehensive about this site fading completely in the background. None of my friends share articles from this site, or tweet things from this site, and that’s very telling.

I still want to check out some of the content though, but I have to try to see if it works on any of my readers first.

Designer who can code or programmer who can design?

Some articles like “We don’t hire designers who can’t code” still make me realize how things have changed or wonder if there’s some kind of generation thing I can’t catch. I’ve always thought there were a lot of designers who can code. Have those people I grew up with just went on to pursue other things eventually that they’re not anymore in the industry?

When I started “designing” sites, I was taught some basic HTML first and from there it seemed like designing how your site looked like was a basic necessity. It’s like, hey, I can do these tables or divs but how do I make it look like a site?  I guess that back then “making a website” or “designing a website” automatically meant designing, coding, and publishing everything on your own.

That was when I was around 12 years old, so around 10 years ago. Back then it seemed like there were a lot of us front-end people who design and make their own stuff. There were so many of those free-layouts sites (mostly using characters from cartoons or anime or other cute things) and a pretty big number of starting-out web designers just made more and more of them (as a hobby, it seemed). Even for those who only wanted to put up their own blog, they had to design and code their own site. And before WordPress or Blogspot became popular, you had to design and code and upload your own blog on a host somewhere on the internet (reminds me of Host-Me, which is one of those sites where you basically find a ‘host’ who has their own domain and will host your site/blog for free in exchange for friendship).

So I pretty much used to see a lot of individuals who can code and design at the same time, although the web industry as we know it now has evolved since then.

I guess I’m just puzzled as to why it seems like design and code are two different areas or skill sets for a number of companies now. And wondering why it is so rare to find people who can design and code too. It’s like, whatever happened to a lot of those people some eight to ten years ago, most disappeared to pursue something else.