How do I become better at UX/web design?
August 13, 2022 5:28 AM   Subscribe

I've worked with some top talent at design agencies that produced amazing web apps and website design. As in some projects I've been on have been nominated at Cannes and other big industry events. I've always been on the development side and was spoiled as I would always take these great designs and make them actually work. I often have projects I want to do on my own but I'm paralyzed by not being able to design anything myself. How do I get better at it? What tools do I use?

I'm sure everyone has seen creative treatment for application or website redesigns. They're pretty extensive and thorough PDFs/PSDs that get sent to the product owner and development team for approval. Frankly I was spoiled most my life by getting some of the best designs out there. I strictly had no creative input except for when there might have been errors in design such as an element looking like the same component but the colors or sizing being off and asking if this was an intentional design element or accident.

I've tried Photoshop/Illustrator/XD and I simply get stuck in my head or stare at a blank canvas. If I remember correctly if you're working on a design team at a large agency you're kind of looking or copying of a lot of designs that other teams have done or you've done so you're not starting blank. Unfortunately I was too honest and never pilfered designs. I think also unlike development work I don't have an end goal, and have no way of measuring if one design is better than the other. I kind of just feel lost with a big blank white screen.

Are there any places that share creative workbooks? Do people pirate creative workbooks online or whatever they might be called now? That might be a bit scrupulous but I'm not trying to steal I'm just trying to maybe get a framework I can springboard off of. I might also know what great design is and thus have a hard time not producing anything that isn't a great design.

Any advice would help, I'd like to be able to quickly prototype and sketch out designs for apps and websites without building them out first basically. Especially for non-technical people involved it is so much easier to show them a creative workbook of what the site will look like then collaborate on a non-styled or ugly app. Any tips or advice would help! "Spend 12 hours a day in Photoshop/Illustrator/XD is also helpful" ... or perhaps there's a methodology of whiteboarding, mood boarding, etc. that goes into designing that I'm unaware of.
posted by geoff. to Media & Arts (12 answers total) 7 users marked this as a favorite
Not trying to be flip: go to design school, or otherwise take some classes to practice and train your eye/design sense. I'm sure there's lots of content online too, but "web design" is such a buzzy field that I have no idea how I'd separate the good stuff from the dreck (maybe others here have some ideas on that).

My view is that knowing how to create compelling and effective designs is about far more than the tools you use. I'm in the same boat you are as a software developer who's worked with some extremely good designers and helped to realize the experience they set out to create. I wish I had more of those design skills, but it really is a different skill-set that's developed in a different way. My takeaway from those projects has been that both a good team of software developers, and a good team of designers, is required. That's not to say you can't get better at design, but it's a quick/easy thing in my experience. Practice/time is required, I think.
posted by Alterscape at 7:13 AM on August 13 [3 favorites]

Response by poster: Yes I felt bad about saying web design as it feels 1990s buzzy but really designing for the constraints of a browser or native apps versus traditional media like billboards or television ads. Most designers I worked with wanted to go to do traditional media (one even did the opening for Casino Royale!) so saw designing websites or ad campaigns as bit below them. Any suggestions if anyone has for design classes even online would be great. I'm not trying to be an award winning designer, but I think even having an eye for design would help me create better applications.

For example I would never have come up with the interactive elements on how TikTok works just by flipping, I'd probably stick to whatever design elements came right out of the box. Even thinking in that direction I think would help expand my world as a developer.
posted by geoff. at 7:18 AM on August 13

No one person came up with TikTok's UI. Any detail on their site has had input from a bunch of engaged and experienced people working together.

Like, I don't know about their specific process, but in general something like that is a big project where groups of people brainstorm, test, and iterate. (You've probably seen this part of the process as a dev, but if not, "test" can mean "show it to an officemate," "pay like six people to come use a wireframe of your design while you watch and take notes," or "release the design to hundreds/thousands/millions of users and measure how they behave.")

Don't hold yourself to that standard, especially not as a novice with no feedback: no mentor, no access to user testing, etc — you will be disappointed. Instead, compare yourself to things that are legitimate solo projects, or find ways to get involved with larger ones.

It occurs to me that if you have design agencies you work with, you may be able to arrange to "ride along"/observe their process for a joint project. That could help you get a more realistic sense of what one person can can do alone or with resources, what two can do collaborating, etc.
posted by flexible-footwear figurine at 7:57 AM on August 13 [3 favorites]

Holy additional coffee, Batman: I meant to write "It's not a quick/easy thing" above.

On further reflection: practice. This stuff takes time, and persistence. It's especially painful when you're already good at something else, and have to go back to close to zero in a new field, because (for me at least) I'm used to being able to just execute but in some new field it's basically "learn it all from scratch and be unskilled again for a long time," and there's really no shortcut there. Have you read Ira Glass on the taste gap? I come back to this quote all the time because it's bloody true, frustrating as that sometimes is.
posted by Alterscape at 8:07 AM on August 13 [2 favorites]

Not mentioned so far is that none of the UX people upstream from you are setting out with a blank canvas, either. They’re all responding to something just as you are. You receive mocks or interactive wireframes that help you determine what technical tools you will choose to solve the problem of making a live website to realize their creative vision. The designers who made those mocks probably received a creative brief to tell them what their goals are: their audience, the tone they need to strike, expected assets, budget, etc. Like you, they also have a kit of tools they reach for which might include past projects, current trends, available freelancers, and inspiration from other design work. This pattern repeats all way up a never ending chain, with everyone responding to some need.

A way for you to learn this process is to observe it in its proper context where the need is expressed and the response planned and iterated. You’ll need to make some friends with the UX people you work with and maybe make yourself a more valuable developer by understanding their part of the process. When you do, you’ll want to avoid using some of the theft/pilfering metaphors you’ve used in your question here.
posted by migurski at 9:05 AM on August 13 [4 favorites]

Response by poster: When you do, you’ll want to avoid using some of the theft/pilfering metaphors you’ve used in your question here.

Thanks I'm probably using terminology that I've used and heard others use in development such as "steal that from the last project" etc. It may be more dry and developer to try to do as little as possible and reuse or use open source whenever possible (this is a good thing). But I can see for more creative endeavors that's not probably the best look.
posted by geoff. at 10:11 AM on August 13

As a graphic designer (mostly print), when I'm in a rut, I will find designs I like from other people, and try to re-create them (as practice, not for clients). This act of 'designing' something that someone else created not only builds muscle memory, but it helps me to look at a piece and figure out how they made it. Inevitably, I can't help but make adjustments as I'm making it, so it becomes my own. So my answer is to look at pieces you like and recreate them.
posted by hydra77 at 12:07 PM on August 13 [1 favorite]

Refactoring UI is made for developers to help them get past that blank page stage. It won't help with the big-picture stuff you're asking about, but it's helped me when I already had an idea of how my side project should behave, but no idea how it should look.
posted by harriet vane at 8:44 PM on August 13

Much good advice here, and it got me thinking about "patient portals". At my age, I deal with a number of medical groups, and each one has a patient portal they use to communicate, and they are all different. And every one has at least one feature that's inexplicably odd.

One of the reasons we are challenged by a blank page is that the very first thing you do closes off myriad possibilities. That's both good and bad, but I'm sure most programmers, including me, have had to abandon an initial idea and start over once the requirements are better understood.

Maybe it would help to think about themes. I think you need two themes. One is visual. Is the screen going to like an appointment book, a calendar, a dashboard, an IRS form, an Etsy shop, or whatever. The second is functional. How many pages? How do the relate to each other? How does the user move between them? And very mportant: how is user input data managed?
posted by SemiSalt at 5:07 AM on August 14

I think it would be worth separating out the different things you're asking. e.g.:
  • How do I learn to use [this design application]?
  • How do I get better at designing websites?
  • How do I get better at coming up with innovative new interfaces?
They're quite different questions with different answers. Apologies if any/all of this is teaching you to suck eggs!

How do I learn to use [this design application]?

I think it's worth separating this out from the "how do I get better at design?" questions because its possible to improve at one while ignoring the other. Or concentrate on one while subconsciously improving at another.

So for this one - how do you best learn? I don't like learning from videos but lots of people do. So focus on finding good videos/books/courses for the one tool you want to learn. Don't worry about improving your design skills here, you're just learning a tool. Once you've learned the basics keep using it, a lot. Becoming fluent in your chosen tool will mean it isn't in your way when you're trying to design.

How do I get better at designing websites?

Aside from finding a good web/digital design course... my approach is to start by either wireframing the pages or building the site, without any style. I need the raw materials, the data, the site structure etc. Some of this is still "design" - just not graphic or interaction/UI/UX design

Once I know what's on each page I'll start thinking about how to structure the pages - what do they have in common? What elements are most important? What relative sizes should things be?

Only then do I start thinking about colour and the special graphic design magic that makes a well-designed site and page structure sing. This is also where my advice falls down because, despite having a (pre-internet) degree in graphic design, I find this stage incredibly difficult! All the decisions seem so arbitrary! But at least you're not starting off with a blank slate - you have the raw material to work with.

I find restrictions are sometimes useful: "use only black, white and one/two colours"; "design the whole site for mobile before doing any desktop-size design"; "use only two text sizes".

When it comes to picking colors I'll either start with a palette I've seen elsewhere and like, or I'll keep refreshing a tool like Coolors and start with that.

As I say, I'm not great at this, and I always find it daunting when I begin. So much of it is practice (I don't do design enough to have managed this; I'm more of a developer).

How do I get better at coming up with innovative new interfaces?

This is the hardest to answer I think. Training, practice, inspiration, experience, peers who challenge and inspire you, hard work, taste, good clients/employers, time and money, reading/watching widely, etc etc. It's one thing to be good at a specific field of design - websites for example, most of which use established interactions - and another to come up with entirely new, and good, interactions/interfaces. There's no short answer or route, so focus on the simpler things first.
posted by fabius at 6:27 AM on August 14 [2 favorites]

Another angle I didn’t see mentioned above: it sounds like you’ve only done agency work so far? Look for a software development role at a company that has an in-house design team. I’m an in-house UX designer and I work closely with the developers on my team from the very start of a project. The scrum team will have a project kickoff in which the customer problem, existing metrics and research, goals, etc are outlined, followed by a brainstorming and prioritization session. That will give you a lot of insight into the design process.

(You’re welcome to message me - I’m always happy to chat about getting started in UX! Currently traveling, hence the brief answer here, but I’ll get back to you mid-week.)
posted by kiripin at 8:54 AM on August 14

Response by poster: I've worked for pretty much all the large ad agencies. In fact I typed in "largest ad agencies" and I've worked for the top 4. So they've had in-house and I avoid projects where creative is done outside. That said at least with the divisions I was a part of while we worked with designers it was after the creative brief and initial designs were done. We might be brought into verify the designs can be done or offer input but creative usually has final say. So I would not have been part of the moodboard sessions, brainstorming, etc. They always kept tech out of it.

But a lot of these projects would be pure marketing based sites, like is more or less a billboard. They're challenging from a technical perspective in their own right, don't get me wrong, but I've moved more towards applications and dashboards. I look forward to your reply midweek. Thanks!
posted by geoff. at 2:40 PM on August 14

« Older $200k for retirement - but already 65   |   Thor (plot) point Newer »

You are not logged in, either login or create an account to post comments