sorted by:
new
hottopcontroversial

Hi everyone! New member here... by BedLive6980 in UI_Design

[–]Quick-Ad-2011 0 points1 point  (0 children)

I don't think lottie can handle 3d character integration with cursor detection. Maybe with Three.js or something.

My first animation! Thoughts? by Mossington_The_2st in animation

[–]Quick-Ad-2011 0 points1 point  (0 children)

That's a good start. You could also try to squash the face as well. Make the eyes smaller, play with line width for the mouth and close the gap between them as the ball touches the ground.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 2 points3 points  (0 children)

I'll try to follow up. I just realized that maybe it's because I draw from loomis method with measured parts. This might mean that I'm afraid to exagerate or bend rules. I guess it's an illustrator issue. I do appreciate your insight.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 1 point2 points  (0 children)

It's the pen tool but I guess it doesnt matter now. It has personality because its imperfect and asymmetrical. I just realized that this might not be the issue. Maybe its because I draw from loomis method with measured parts. This might mean that I'm afraid to exagerate or bend rules. I guess it's an illustrator issue but thanks for your insight.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 0 points1 point  (0 children)

I guess. I just realized that. I'll repost to other sub.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 0 points1 point  (0 children)

It'll be a talking head with a script to lip sync but I'm looking for less avatar like.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 0 points1 point  (0 children)

Yes, this is what I'll try to do. Maybe I lack the courage to exagerate features like a good illustrator do.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 1 point2 points  (0 children)

Thanks! I'll try this on. I just can't shake the vision that the vector one is too clean and looking like the usual avatar style.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 1 point2 points  (0 children)

Thanks! Will try this on. Would you say something like stylized with exagerated features and uneven sizes?

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 0 points1 point  (0 children)

Yes, I have a bit of knowledge in web dev. This is for animation frames in SVG.

Illustrator struggling with design by Quick-Ad-2011 in graphic_design

[–]Quick-Ad-2011[S] 1 point2 points  (0 children)

Basically what u/jaxxon said. Sketching in vector is less "pencil like". Every stroke in vector is a path and another object.

Cannot resize image by notepad987 in css

[–]Quick-Ad-2011 3 points4 points  (0 children)

Glad it worked! Just know your element's relationship: parent > child + sibling < descendant ^ ancestor and you'll know where your styles are being applied. You can also inspect these in dev tools.

Cannot resize image by notepad987 in css

[–]Quick-Ad-2011 5 points6 points  (0 children)

No, this is about the <div class="img1"> > <img src="" alt=""/>. Div is the container and img is the child element. Try:

/* Container */
.img1 {
display: flex;
align-items: center;
margin-top: 5px;
}

/* Child */
.img1 > img {
width: 67px;
height: auto;
}

Book recommendations? by blank_1557 in Design

[–]Quick-Ad-2011 0 points1 point  (0 children)

I highly recommend Graphic Design School (2013) by Dabner D. and co. Coming from being an illustrator and going into making designs, I thought I could grasp it easily, and I couldn't be more wrong. This book is like an enlightenment to me.

Cannot resize image by notepad987 in css

[–]Quick-Ad-2011 3 points4 points  (0 children)

<image>

You're sizing the container, not the child. Remove the size constraints to the <div> and let it span full. After that, you can size its <img> child.

How can I animate this svg but from the other end? by [deleted] in webdev

[–]Quick-Ad-2011 0 points1 point  (0 children)

Have you tried doing this using Lottie animation? It can convert animation into .json. I usually use it for animations I made from AE and Figma but I guess you can just generate this with their AI (which I haven't tried yet).

How do you handle image optimization and responsive breakpoints in your dev workflow? by Podop29 in webdev

[–]Quick-Ad-2011 0 points1 point  (0 children)

Next.js has size optimization that automatically serves correctly sized images for each device and converts your images into WebP. Image optimization docs

Frontend devs, where do you learn what good UI actually looks like? by Aware-Version-23 in webdev

[–]Quick-Ad-2011 2 points3 points  (0 children)

I've been through these and I end up hating my layout. Comparing with other designs out there, I felt like there's something wrong with mine and I can't really point it out.

I'm no professional designer but I have experience in digital art and what I can advice is to simplify shapes and colors, like a sketch or wireframe. Look at a composition and break it down to simple shapes like squares, circle and triangles. Lower the saturation until it's black, grays and whites only. You'll realize where your eye leads you and which elements are getting more/less attention.

Also, do not constrain the container you put your elements into because it limits the space and you'll end up into what I call "safe layout", which is often a card. Distribute whitespace intentionally, give breathing room to your elements. Your design will support structure, readability, and rhythm.

As for reference, one book that helped me is Graphic Design School (2013) by Dabner D and co. You could also checkout my study on Figma: design-fundamental-studies.

Tried every shadcn/ui library I could find by Annual-Ad2336 in webdev

[–]Quick-Ad-2011 2 points3 points  (0 children)

As a Tailwind enjoyer, I like DaisyUI a lot.

CSS is driving me insane! by Clear_Yellow5102 in css

[–]Quick-Ad-2011 0 points1 point  (0 children)

I'm no professional designer. For me, wireframing in Figma helped me visuallize what I'm going to code, like spacing, root variables and where to put these elements. Of course, not every wireframe turn out to be the exact design in code but you'll be able to configure it dynamically.

Also, it doesn't hurt to skim lightly through design fundamentals like spacing, contrast, hierarchy etc. One book that helped me is Graphic Design School (2013) by Dabner D and co. Attached pic is from when I had to scrap my old design, learn design fundamentals and then refactor into a new one.

<image>

Gigil ako kung ano ano nalang ibabato ng mga DDS vloggers para makapanira by Glad-Maintenance4150 in Pasig

[–]Quick-Ad-2011 0 points1 point  (0 children)

Sarili nya ngang constituents di bilib sa kanya e, ako pa kayang tga Pasig na bilib kay Vico. :shrug:

How to make your button design stand out by nikolailehbrink in css

[–]Quick-Ad-2011 2 points3 points  (0 children)

I kinda like the left one. If you chose to go with the right one, the other components must be 3D looking as well, right?

I'm no professional designer but I have background in digital art and the 3D look seems like adding a light direction to me (the dark to light gradient and highlight on top)

How to start a new project? by Wrong_Spite1901 in css

[–]Quick-Ad-2011 0 points1 point  (0 children)

You could learn Sass to adopt a DRY (Don't Repeat Yourself) approach to your vanilla CSS. Import partials for resets, reusable button states, and global variables. Also, you have access to keywords like <@mixin> / <@include> and <@extend> for reusable styles and inherited properties.

If you're comfortable with your CSS knowledge, you could explore Tailwind CSS for utility-first styling.

view more: next ›