How to Become a UX Designer

During Q&A sessions at conferences someone will inevitably ask: "Which applications do you use for your work?" — which is probably the least helpful question you can ever ask if you want to improve as a designer.

There seems to be a segment of beginners in many professions that perceives the competency gap as purely a software solution.

Completely agree with you. Once you've got the methods & thinking down you can apply that to any tool. And often the best tool is the one that helps you communicate & test the fastest.

And note that many, many companies still do not understand UX. There's a good chance your interviewer/manager will have little to no understanding of UX. They will favor the visual beauty of your work over any of the aforementioned qualities that make a great UX designer.

Your first point is exactly right. The tools (and even the output) matter little if you haven't gotten the research and product thinking right. I recently wrote on this related to product design, if you're interested: https://medium.freecodecamp.com/your-best-work-will-be-invis...

I like the analogy, but I'm not sure how you intended it since I think it can reasonably make different points. It can surely help if an architect knows about material and construction (see, for example, the work of Christopher Alexander's group who relied on knowledge of materials and construction to wildly reduce costs while increasing quality). But it's also plainly true that any architect is going to be dependent on skilled contractors. Might be fun to read or write an article exploring all the nuances of the analogy.

Speaking as a UX designer by title and inclination who has to spend most of his time as a full stack dev by economic necessity, I've come to the view that in an ideal world most designers ought not have to code. It works well for me, since I'd personally get bored only implementing or only designing. But every week I feel the tension between very different demands on my limited energy, ability, and time. I feel how I almost subconsciously compromise my design work to get it to something I can implement in a realistic time, how the fact I've invested effort into the implementation very subtly pressures me to not make serious design changes, how my figuring out a cool coding trick or library encourages me to add it to my design when it's actually a superfluous distraction (see the vast majority of products by UI engineers who care about design).

To be honest, I'm hard pressed to say how being able to build essentially whatever I want has helped my design work, especially now that there are pretty good, quick to use prototyping tools like Atomic. Maybe it has in such a deep way that I don't even notice it, but I'm skeptical! :)

That said, I do personally agree with the author that, all else equal, some coding knowledge is a good thing if only to help in communicating with and empathizing with developers.

I'm a developer with some interest in UX, design and perhaps most, graphical design and typography.

I'm fine with no-coding UX specialists however - I have notice that not being able to code at all while working in a rather "techy" role is often a proxy for not being able to create a coherent mental model of the the processes and features that they are building an interface for.

This might be a bigger or smaller problem - if the system complexity is low, then maybe "superficial" features like readability, flow and layout is more important. It's hard enough to get good at - I suspect that some inherent flair is required to get good at that.

If there is a true inherent complexity, then the more hard-core aspects of modelling and how well the users can understand and interact with the model is of more importance. It's another skill set, but when it's needed it's very important to get right.

Learning to code typically enhances ones modelling skills, and more importantly "failed" devs are probably not suited for UX either.

There are of course plenty of people that are intelligent and smart enough to get god on "modelling" on their own.

That said, there seems to be a lot of UX people around that have read a few books and are practicing some generalized rules they found on some websites, and could fall head first in big pile of good design without noticing it... I doubt it would be hard to compete with them. A cool haircut seems to be enough.

While I am whining, while Personas is a good tool - keep it to a minimum - no full size cutout dolls, CV, background story, accessories, etc. I suggest to keep it to the level described in User Story Mapping (Patterson) and stop there... Anchor the personas with the sales guys, support guys, and people that potentially have met a user.

Or a good broadly skilled designer ;)

I have found https://balsamiq.com/ to be a great way to move fast; I prefer to work at first in the 'cartoony' mode of crooked lines etc.. then present straight edged wire frames to the stake holders.

check out balsamiq. and perhaps go through their tutorial: http://www.uxapprentice.com.

Sketch is a more powerful tool (i use it most of the time now), but balsamiq is a great place to start.

I really love Precursor, you don't need an account to get started and it's simplicity makes it really quick to throw something together.

https://precursorapp.com/

Nothing beats pen and paper. Probably you already have it available, it lends itself to be low-fidelity (and high-fidelity if you have an artistic side) and very easy and fast to use.

Sketch / Omnigraffle.

Sketch is my personal favorite. Balsamiq can work and is commonly recommended, but IMO turn off the "hand drawn" effects. They're great for demoing rough things to clients in a way that says "this isn't final", but if you're actually trying to lay out a page at 100% resolution they're going to give you a wildly wrong sense of what things are what size.

You should ideally be able to skip using these tools if you are proficient enough in basic html/css. It's easier to share a deployed static website with stakeholders, easier to immediately see media queries in action, you can use partials, etc. I personally use Middleman as it's dead quick to get up and running. Once you establish a library of components you can plug and play in real code just like you could with these tools - with a little head start on building it out.

Once you get in the habit of building static sites as wireframe prototypes it's hard to go back to "wireframe only" tool.

I usually start with pen/paper because I find it the fastest to get a bunch of ideas out. Then from there I'd go with whatever tool you think will be most efficient. I personally use Balsamiq because it's really quick & easy (drag/drop) and then if my first wireframes need drastic changes it's still quick to change. I'm then taking these wireframes to clients or teammates to review and improve before focusing on design. If you're going to end up using a design tool for a high-fidelity version you can use Sketch or Illustrator for wireframes, the only downside is getting too focused on pixel perfection at an early stage. I like keeping the process pretty flexible, sometimes you can pass a wireframe to a front-end dev if you've got a solid style guide, other times you want a high-fidelity design or a prototype.

Webflow - Really easy for mocking a site up, as well as more advanced design. Outputs the best code I've seen, so it could be used in production. https://webflow.com/

Pop - iOS app. Draw on paper, take photos, mock up the page interaction. Nice for early demos. https://popapp.in/

Atomic is has been my choice for a long time now and they keep making it better. It's best used as the UI flow tool, complemented with something like Pixelmator and Sketch for asset creation and visual detail work.

If I have to show other people very early stage ideas I still use Balsamiq for the artificial lo-fi effect, but with other designers who have more control over their imaginations I'll just throw something together in Atomic.

Not sure if i'd call it a beginners tool but I much prefer just building things out in HTML. I prefer to have exacting measurements (something is 50% wid or whatever) and it's very easy to update man items from say a list after first iteration. A front end templating system helps a lot w/ this.

https://quant-ux.com/ is very promising . It allows for input fields and some basic logic, which can be pretty painful/impossible in other tools (e.g. invision, marvel,etc)