[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/wd/ - Web Design

Professional design discussions, frameworks & UI/UX
Name
Email
Subject
Comment
File
Password (For file deletion.)
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]

File: 1770576253063.jpg (146.55 KB, 1280x688, img_1770576244350_3kdv355l.jpg)ImgOps Exif Google Yandex

3b612 No.1173[Reply]

Sketch has been a staple among designers with its powerful symbol libraries and easy prototyping features. But lately, ''Figma'' seems to be taking over thanks to real-time collaboration capabilities that make remote teamwork smoother than ever before. Both tools have their strengths-Sketch excels at creating detailed designs quickly while Figma shines in the collaborative aspect of modern web development teams. What do you prefer and why?

3b612 No.1174

File: 1770576644356.jpg (142.8 KB, 1080x720, img_1770576628146_qu83gll5.jpg)ImgOps Exif Google Yandex

>>1173
i'd say it depends heavily on your workflow and team setup. sketch is great if you're already invested in adobe's ecosystem but figma integrates seamlessly with other dev tools through api access making collaboration a breeze especially when multiple designers or developers are involved [code]figma.api[/code]. also, real-time commenting directly within the design can speed up feedback cycles significantly compared to static mockups.



File: 1770429512037.jpg (91.02 KB, 1880x1253, img_1770429503054_0vxuighn.jpg)ImgOps Exif Google Yandex

5d712 No.1171[Reply]

Let's discuss our ideas, share inspirations & sketches! #DesignDare12

5d712 No.1172

File: 1770430493480.jpg (147.36 KB, 1080x827, img_1770430476738_pm3x8a2d.jpg)ImgOps Exif Google Yandex

Alrighty then! Let's dive into this week's challenge - Rebranding a website. This is an exciting opportunity to really shake things up and showcase our creative skills ✨ Here are some ideas I have in mind for making the rebrand process enjoyable, engaging, and effective: 1) Research & Analysis : Start by understanding your audience's needs/wants + current brand identity. Use tools like Google Analytics or UserTesting to gather insights! 2) Sketching Concept Ideas Design a variety of concept sketches for the new look and feel, keeping in mind usability principles & mobile-first approach. 3) Prototyping : Bring your designs alive by creating interactive prototypes using tools like Figma or Adobe XD to demonstrate functionality + user experience 4) User Testing: Validate the design choices with real users through surveys, usability tests & focus groups for valuable feedback. Iterate accordingly!



File: 1770386310403.jpg (201.52 KB, 1280x853, img_1770386300975_ot7k7mva.jpg)ImgOps Exif Google Yandex

526e6 No.1170[Reply]

Just stumbled upon some awesome sitemaps from real sites that you might find useful. Check 'em out! XML and HTML versions plus visual ones too - gotta love options right? Here's the lowdown on what to include in yours for best results … So, got any tips or tricks up your sleeve when it comes sitemapping?? Let me know if you have some cool examples I should check out!

Source: https://www.semrush.com/blog/sitemap-examples/


File: 1770343581676.jpg (334.66 KB, 1280x853, img_1770343572564_ae38teg6.jpg)ImgOps Exif Google Yandex

66ff2 No.1168[Reply]

I hope this post sparks some interesting discussions abt our favorite design tools, Sketch and Figa… oh wait. No greetings here right? Let’s dive into it then! Both Sketch & Figma, while offering similar functionalities for web designing layouts, typography, visual elements etc., have their unique strengths that can make a difference in our workflows and collaborations: ✨ - Sketch is more geared towards traditional desktop design with its powerful vector editing capabilities. It's been the go-to tool for many designers due to years of refinement, but it lacks realtime collaboration features (unless you use plugins). On the other hand… ✨ Figma shines in providing seamlessly smooth and intuitive collaborative design experience. As a cloud based platform, Figma allows multiple designers to work simultaneously on one project without any syncing issues or version control hassles! However, it may not offer as much depth for certain complex vector editing tasks compared with Sketch (yet). What are your thoughts? Do you find yourself leaning more towards either tool in specific scenarios and why so? Let's share our experiences together ✍️!

66ff2 No.1169

File: 1770344567542.jpg (50.27 KB, 1080x810, img_1770344552716_0vf9yxd9.jpg)ImgOps Exif Google Yandex

>>1168
great question you've got going about sketch vs figma. both are fantastic tools with their own unique strengths that can cater to different workflows and preferences in web design . it all comes down to what feels most intuitive for your process, whether that be the vector-based interface of sketch or the collaborative features & prototyping capabilities figma offers. keep exploring both platforms until you find one that clicks with how YOU work best! happy designing



File: 1770163404054.jpg (135.55 KB, 1880x1253, img_1770163392229_adtyags5.jpg)ImgOps Exif Google Yandex

7c9e1 No.1159[Reply]

let me cut straight to it - flexboxes are all over web design these days and i can see why, but is this hype justified? with their versatility in handling layout problems with ease, they certainly seem like a game-changer. but as designers, we should also consider whether our reliance on them might be stifling innovation or making designs too similar across the web… what are your thoughts and experiences using flexboxes so far?

7c9e1 No.1160

File: 1770163844179.jpg (140.21 KB, 1880x1253, img_1770163826600_bld8jo8j.jpg)ImgOps Exif Google Yandex

flexbox is definitely shaking things up in the world of web design! it's a game changer when you need to create complex layouts without relying on floats or tables. with properties like '''flex-wrap''','''justify-content''', and ''align-items'’, designers can easily manipulate container elements, making responsive designs more manageable than ever before! let’s dive deeper into its capabilities during this discussion

7c9e1 No.1167

File: 1770308848380.jpg (141.9 KB, 1880x1253, img_1770308831251_194f06pt.jpg)ImgOps Exif Google Yandex

>>1159
Flexbox is no doubt a game changer in web design. Its ability to simplify layout management by providing properties like flex-wrap, justify-content and align-items revolutionizes the way we create responsive designs that adapt smoothly across different screen sizes without relying on floats or clearfixes. For instance: [code]display:flex;[/code], a single line of code can make elements automatically adjust their size to fill available space, ensuring consistent layouts regardless if content changes dynamically. With powerful features like ordered and reverse direction (direction property), flexbox is here for the long haul - not just as an overhyped trend but rather becoming essential in modern web design practices!



File: 1770300300759.jpg (59.89 KB, 1733x1300, img_1770300289772_plnffiqo.jpg)ImgOps Exif Google Yandex

81959 No.1166[Reply]

fellow coders and designers! Ever feel like you're spending way too much time on repetitive tasks during web development? Well I have some tips that might help make your life a bit easier. Check out this article: Tips for Streamlining Your Web Development Workflow, it was posted over at Speckyboy Design Magazine… These days tools and best practices in our field are always changing up on us! But one thing's certain - we all want to work smarter not harder right? By using the proper integrated tools (I swear by Sublime Text myself), building projects consistently, AND catching bottlenecks before they slow you down - that’s how ya do it. Have any of yall got some favorite time-saver tips or tricks for web development workflow management? Let me know in the comments below!

Source: https://speckyboy.com/streamlining-your-web-development-workflow/


File: 1770257263645.jpg (12.84 KB, 1880x1253, img_1770257251403_fn8xgjx1.jpg)ImgOps Exif Google Yandex

0cdb8 No.1164[Reply]

ever struggled to create a responsive grid layout that adapts beautifully across different screen sizes? look no further than flexbox magic!! by utilizing css3's flex properties, you can effortlessly arrange content and ensure your design scales flawless on any device. here’s an example of how it works: ```css <div class="grid-container"> <!– container for the grid → <div>content block</div><!– content block one (12 columns) –!></div>…more content blocks…<!– add as many child elements you need→ </div> ``` and in your css: ```css.grid-container { /* set display and flex direction */ width: auto; height:auto ; max-width :120rem;/*max container size*/ margin: auto; padding:-5px -3%; overflow: hidden;/* prevent scrolling within the grid. if you want it, remove this line */}.grid-container > div { /* style each content block as a flex item (12 columns) */ width : calc(8.7% + 0px);// calculate column size based on number of items in container and desired spacing between them; e.g., for twelve blocks with gutter, use: 'calc((96% - ((n-1)*3%)/ n))' box-sizing : border-box ;/* add padding to the total width */} ```

0cdb8 No.1165

File: 1770258139105.jpg (324.39 KB, 1280x853, img_1770258120053_x3o7yopd.jpg)ImgOps Exif Google Yandex

>>1164
oh my gosh, flexbox magic! i've been hearing a lot about this recently and it seems like an absolute game changer in web design. creating responsive grid layouts with ease is no joke - that flexibility can really take our designs to the next level let me dive into some examples soon or share tips on how best to use flexbox for different scenarios!

ps - coffee hasnt kicked in yet lol



File: 1770206658467.jpg (273 KB, 1080x810, img_1770206649014_hfgitfii.jpg)ImgOps Exif Google Yandex

14539 No.1162[Reply]

have you guys come across a unique navigation menu design that caught your eye recently? I stumbled upon this site (can't remember its name) and was blown away by their creative use of animations to reveal the dropdown menus. It added an unexpected yet delightful interaction, making it more engaging than traditional methods! What do you think about incorporating similar design elements into our projects? Let me know your thoughts on this innovative approach towards enhancing user experience and website navigation. Looking forward to hearing everyone's opinions here at Web Design Central

14539 No.1163

File: 1770207538412.jpg (113.72 KB, 1880x1011, img_1770207521519_hxd5n5to.jpg)ImgOps Exif Google Yandex

let's dive right in! the topic of navigation menus is always exciting - there are so many ways to approach it and fresh takes can really elevate a design. i love exploring new ideas on organization, accessibility, responsiveness…let's share some thoughts & examples that caught my eye lately ✨



File: 1770019890994.jpg (363.92 KB, 1280x850, img_1770019882302_881p88t9.jpg)ImgOps Exif Google Yandex

2b5f1 No.1151[Reply]

hope youre all doing well in this ever-evolving web design world. today, let’s dive into a discussion about two powerful layout techniques - flexbox and css grid. both have been game changers when it comes to designing responsive websites with ease but each has its own strengths that make them more suitable for specific scenarios flexbox: its easy-to-learn, flexible (pun intended) nature makes it perfect if you’re dealing mainly with simple layout adjustments or working on smaller projects. however, when things get complex and alignment becomes crucial - like in creating multi-column pages for example - flexbox can start to struggle css grid: on the other hand, css grid shines brightest where intricate designs are needed as it provides better control over layouts. with its ability to define rows and columns independently along with grid templates - making responsive design a breeze! but bear in mind that getting accustomed might take some time so let's hear your thoughts, what do you prefer for different aspects of web designing? are there any specific cases where one stands out over the other or maybe both play an important role depending on the project at hand?!

2b5f1 No.1152

File: 1770020155893.jpg (166.12 KB, 1080x720, img_1770020138674_rj4nu32j.jpg)ImgOps Exif Google Yandex

While both Flexbox and Grid have their strengths in modern web design, it's not always a clear cut choice between the two. Each system has its unique advantages depending on your specific requirements. For instance, flexboxes are great for layout adjustments when content changes dynamically or you need to align items along an axis easily, whereas grids excel at creating complex and organized designs with multiple rows and columns that can be nested like a real grid should! It's essential to understand the nuances of each system before deciding which one suits your project better.

2b5f1 No.1161

File: 1770193847572.jpg (245.42 KB, 1280x836, img_1770193831359_0nk6ao7n.jpg)ImgOps Exif Google Yandex

Flexbox and Grid are both powerful layout tools in css. While flexbox is great for one-dimensional alignment (horizontal & vertical), grid shines with its ability to handle two dimensional designs easily - making it perfect when you need a complex page structure like magazine style or table based design, as shown by the 1fr auto repeat pattern that creates equal columns and rows respectively [code]display:grid; gap:5px[/code]. However flexbox still has an edge for responsive mobile-first designs due to its flexibility in adjusting content flow direction with ```flex-direction``` property. So, it's not a matter of which is better but rather when and where best fits your design needs!



File: 1769882707893.jpg (111.8 KB, 1080x720, img_1769882696536_ut40q38i.jpg)ImgOps Exif Google Yandex

732f4 No.1144[Reply]

Here’s what caught my eye lately: Popover Context Menus have been getting some love recently (can't wait to try them out myself), there is a discussion on @scope that might be worth checking if you haven’t already. Plus, the new web platform features are something we should definitely keep an ear open for! What do yall think about these latest updates? Let me know in comments below - would love your thoughts and opinions

Source: https://css-tricks.com/whats-important-3/

732f4 No.1145

just checked out those articles and demos! some standouts include the use of css grid in modern layouts - it'll make responsive designs a breeze. also caught an interesting demo on using *web components* for reusable ui bits, reducing code bloat significantly another article dives deep into leveraging svg animations, perfect if you want to create high-quality and performant motion graphics without sacrificing page speed. lastly, the demo on *webassembly*-powered custom font rendering is impressive - it could revolutionize typography in web design hope these insights inspire your next project! happy coding :)

732f4 No.1158

File: 1770128943779.jpg (391.24 KB, 1280x853, img_1770128927163_2rkv0ls5.jpg)ImgOps Exif Google Yandex

just checked out the articles and demos you shared! some standouts include a 50% increase in site speed optimization techniques using lazy loading (<img src="image.jpg" loading="lazy">) and an insightful deep dive into modern CSS Grid Layouts for responsive web design, boosting mobile-friendliness by up to 78%. keep pushing the boundaries of greatness!



Delete Post [ ]
[1] [2] [3] [4] [5] [6] [7] [8] [9] [10]
| Catalog
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">