Earlier quoted context omitted.
Bootstrap is so antiquated. It is also far from easy, and even if you learn a lot about bootstrap is will not make your project suddenly look good. Not to mention the container system is one of the most confusing things I have ever seen, but maybe that is just me.
What would you recommend instead? Note the criterion here is speed, not modernity or aesthetics. Edit: by speed, I mean speed of development, or ease of development.
Ask HN: How do you manage UI/UX for your side projects?
81–90 of 203 posts
Re: Ask HN: How do you manage UI/UX for your side projects?
#82Earlier quoted context omitted.
Bootstrap is so antiquated. It is also far from easy, and even if you learn a lot about bootstrap is will not make your project suddenly look good. Not to mention the container system is one of the most confusing things I have ever seen, but maybe that is just me.
What would you recommend in its place? I’ve been using bootstrap for any web side projects of mine mostly for its ability to flex and handle multiple devices sizes and also because its defaults look passable out of the box. I agree containers are confusing but honestly making a custom web app look good on all resolutions/aspect ratios is complicated in my opinion.
Re: Ask HN: How do you manage UI/UX for your side projects?
#83I learned design + frontend engineering together. My side project turned into my full-time startup: https://www.cacher.io The best advice I can give in terms of managing UX: 0. Get Sketch ( https://www.sketchapp.com ) and use one of its UI kits ( https://www.sketchappsources.com ) to lay out your designs. While you should pay attention to visual details, you won't need to lay out every state since you won't be showin…
Re: Ask HN: How do you manage UI/UX for your side projects?
#84A lot of engineers have the mentality of "engineering is hard, but design is just whatever some color matching and styling". I'll prob. be downvoted but here's my honest opinion: I think you'll gain a lot career-wise to learn about UX and UI. You'll be able to understand products in a deeper level from the customer's side and will then be able to make better decisions as an engineer. You'll also have a much easier ti…
Time for me to rant about how pointless and useless "color theory" is beyond the obvious things like red is for errors and green is for success. It's just a bunch of non-sequitors where people take random facts and then apply them after the fact on particular designs.
Things like trying to design using colors from swatches or using colors based on their position on the color wheel are examples of what not to do because the ideas behind them are often misunderstood and therefore poorly applied.
And don't even get me started on color psychology. For example, they'll take some fact like a lot of foods aren't blue or that some mould is blue and then say that's why you shouldn't use it for food related designs. Which is rubbish because you definitely want a nice blue for things like blue cheese, or for water related stuff. I could easily see someone thinking that having a picture of the ocean on a menu or part of their advertising is bad because of these silly articles even if that's their restaurant theme. It's not just about the color, but the overall design.
Re: Ask HN: How do you manage UI/UX for your side projects?
#85I've multiple solutions: 0. Use a css framework like Bootstrap or Bulma, it's not difficult to put together a website/webapp with a bit of CSS skills (you don't need to know a lot of CSS to create a good experience) 1. Team up with the UI/UX designer who you've worked in past and offer them your backend expertise for their project. Good ol barter has saved my ass multiple times by now. 2. If you don't want to get som…
Bootstrap is so antiquated. It is also far from easy, and even if you learn a lot about bootstrap is will not make your project suddenly look good. Not to mention the container system is one of the most confusing things I have ever seen, but maybe that is just me.
Re: Ask HN: How do you manage UI/UX for your side projects?
#86Re: Ask HN: How do you manage UI/UX for your side projects?
#87Almost every possible control and behavior you need has been figured out.
On all my new projects I start with a commercial bootstrap wrapper. Wrapbootstrap has a lot of great ones for under $30. [1]
The templates come with everything from basic css to the newest wizbang stuff.
You can ramp on bootstrap layouts quickly because you can copy entire ui elements from the demo pages.
You can also build cascading templates pretty quickly using the examples that come with it since it is always the same layout largely.
I would not recommend trying to become a ui expert as top comment suggests, because that takes a long time. Instead, build with someone else’s great work in a bootstrap wrapper and learn as much as you need to move your project forward and no more.
Re: Ask HN: How do you manage UI/UX for your side projects?
#88- an exploratory phase, where the designer interviews the stakeholders, analyzes the current product (if it is a redesign), makes a benchmark of the competing products and services;
- a research phase, where the designer involves actual or potential users to understand their needs, goals, their knowledge, their behaviors; she does interviews, observations, and uses methods like the laddering, the free listing, the card sorting, the task analysis and so on
- the raw results of the research are documented in a number of deliverables:
* personae
* scenarios
* customer journeys / experience maps
* conceptualizations
* taxonomies and navigation trees
- the research is translated into the design of the product, producing wireframes or low fidelity prototypes, designing the macro and the micro information architecture, the interaction, the navigation;
- a design system should be adopted and / or developed, identifying the components, the colors, the typography, the tone of voice
- a high fidelity prototype applies the design system to the low fidelity prototipes
- everything should be tested with the users, in different moments: competitive testing (to test the competitors' products), exploratory testing, confirmatory testing; prototypes should also be evaluated to verify the conformity to the standards and to the design system / style guides;This is UX design (different experts will describe it in slightly different ways, but the structure remains the same).
I'm obviously aware that this process would be a big effort for a side project. But it's very important to keep in mind that this is the right approach, and in the long run, the process will decrease the risk of failure.
Re: Ask HN: How do you manage UI/UX for your side projects?
#89There are folks who're able to design in code (Basecamp style), folks who're only able to design in a drawing tool and does not know CSS at all (the Dribbble crowd), and the unicorns that I'm so jealous of who're able to play in both courts masterfully.
But knowing design doesn't have much to do with tools - HTML/CSS or Sketch. I've observed folks from all three categories, and my singular take-away was practice, practice, practice. Some people have an aesthetic bend that gives them an advantage, but most of us can build a basic understanding by being deeply interested in the craft and putting in the hours. Search for "how to be a designer", there is a rich array of resources. Pick a book like The Non-Designer's Design Book, an online course like refactoringui, and a DailyUI challenge. Start deliberate practice. Give it a few hundred hours.
Re: Ask HN: How do you manage UI/UX for your side projects?
#90A lot of engineers have the mentality of "engineering is hard, but design is just whatever some color matching and styling". I'll prob. be downvoted but here's my honest opinion: I think you'll gain a lot career-wise to learn about UX and UI. You'll be able to understand products in a deeper level from the customer's side and will then be able to make better decisions as an engineer. You'll also have a much easier ti…
> Basic of color theory Time for me to rant about how pointless and useless "color theory" is beyond the obvious things like red is for errors and green is for success. It's just a bunch of non-sequitors where people take random facts and then apply them after the fact on particular designs. Things like trying to design using colors from swatches or using colors based on their position on the color wheel are examples…
You could start with the Wikipedia page to get a quick overview of what color theory really is: https://en.wikipedia.org/wiki/Color_theory
It is not the pseudo-scientific mumbo-jumbo strawman you're ranting against. Color theory makes no subjective judgements on what colors "mean" or should be used for, but instead focuses on the visual properties and perception of color.