mastouille.fr est l'un des nombreux serveurs Mastodon indépendants que vous pouvez utiliser pour participer au fédiverse.
Mastouille est une instance Mastodon durable, ouverte, et hébergée en France.

Administré par :

Statistiques du serveur :

589
comptes actifs

#uiux

0 message0 participant0 message aujourd’hui
Yuri :godot:<p>📘🔑 This is going to be the main menu in my puzzle game, and there is nothing you can do about it!</p><p><a href="https://mastodon.gamedev.place/tags/gamedev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>gamedev</span></a> <a href="https://mastodon.gamedev.place/tags/ui" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ui</span></a> <a href="https://mastodon.gamedev.place/tags/uiux" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>uiux</span></a></p>
mytwobits01<p>Hey, I've got a great idea! How about light switches that disappear until you move your hand over them? Otherwise they're just invisible!</p><p>Great idea, right?</p><p>Then why did you do it to the SCROLL BARS?!</p><p><a href="https://freeradical.zone/tags/UI" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UI</span></a> <a href="https://freeradical.zone/tags/UX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UX</span></a> <a href="https://freeradical.zone/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p>
Michael T Babcock<p><span class="h-card" translate="no"><a href="https://fedia.social/@wilhelm" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>wilhelm</span></a></span> <span class="h-card" translate="no"><a href="https://floss.social/@CoMaps" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>CoMaps</span></a></span> I feel like this is just a case of having written software long enough to know the hypotheticals.<br>"Oh why do users keep hitting back there and losing their settings? Obviously we should save by default."<br>or<br>"Everyone seems to be using this same feature 3 levels deep in the settings, lets move it up to the front page."<br>There are LOTS of random things <a href="https://floss.social/tags/telemetry" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>telemetry</span></a> helps you improve in software if you're the type who cares about UI/UX.<br><a href="https://floss.social/tags/uiux" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>uiux</span></a> <a href="https://floss.social/tags/softwareDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>softwareDevelopment</span></a></p>
Mario Alberto Guzmán<p>Apple Design creating all sorts of rules so that our apps adhere to their standards of fit and finish (even throwing your icons in squircle jail in Tahoe) makes me feel like they have gone full-blown HOA.</p><p>Mac OS X Tiger was more like those cute/quaint towns with character and Tahoe is the result of gentrification and knocking all that down for McMansions/Cookie-cutter homes with HOAs.</p><p>Your app has to go through everything they want and fit their mold.</p><p><a href="https://mastodon.social/tags/macOSTahoe" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOSTahoe</span></a> <a href="https://mastodon.social/tags/WWDC25" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WWDC25</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p><p>macOS Tahoe:</p>
Ian K. Rogers ikr?╭ರ_ಠ<p>It's no small thing, CSS can now do carousels natively, with no javascript.</p><p>"scroll buttons, scroll markers, scroll driven animation, scroll-state() queries, :has(), grid, anchor and so much more.</p><p>Even more impressive is the accessibility story.</p><p>Carousel best practices are handled by the browser, thanks to the engineering and accessibility teams working together. It'd be very difficult to make a more accessible carousel than this."</p><p><a href="https://mstdn.social/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>CSS</span></a> <a href="https://mstdn.social/tags/frontend" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>frontend</span></a> <a href="https://mstdn.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> </p><p><a href="https://developer.chrome.com/blog/carousels-with-css" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">developer.chrome.com/blog/caro</span><span class="invisible">usels-with-css</span></a></p>
Mario Alberto Guzmán<p>I think I found probably the best implementation of <a href="https://mastodon.social/tags/LiquidGlass" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>LiquidGlass</span></a> effects by UI designer &amp; Artist <span class="h-card" translate="no"><a href="https://mastodon.social/@7luyuhang" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>7luyuhang</span></a></span>. I’m blown away.</p><p>In this case, some of the Liquid Glass effects like the borders/edges of a glass surface are captured for some buttons and the LCD display. Looks AMAZING! Love how the REC light bounces off the edge.</p><p>Honestly what <span class="h-card" translate="no"><a href="https://mastodon.social/@7luyuhang" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>7luyuhang</span></a></span> does is what I thought Apple’s UI would have evolved into. But it didn’t.</p><p>Check out their work (and follow them):<br><a href="https://www.instagram.com/p/DL2-ssmO1jj/?igsh=eXFoY2lidjIzZjVn" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://www.</span><span class="ellipsis">instagram.com/p/DL2-ssmO1jj/?i</span><span class="invisible">gsh=eXFoY2lidjIzZjVn</span></a></p><p><a href="https://mastodon.social/tags/uiux" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>uiux</span></a></p>
zeldman<p>Usability gets a makeover: bold, emotional, and data-backed. Alicia Blázquez welcomes us to the new, more emotional design that’s lifting us out of flat, frills-free UX.</p><p><a href="https://automattic.design/2025/07/01/from-flat-to-feel/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">automattic.design/2025/07/01/f</span><span class="invisible">rom-flat-to-feel/</span></a> <a href="https://front-end.social/tags/uiux" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>uiux</span></a> <a href="https://front-end.social/tags/EmotionalDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>EmotionalDesign</span></a> <a href="https://front-end.social/tags/webdesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webdesign</span></a> <a href="https://front-end.social/tags/trends" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>trends</span></a> <a href="https://front-end.social/tags/ProductDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ProductDesign</span></a></p>
Rémi Cardona<p><span class="h-card" translate="no"><a href="https://gruene.social/@jon" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>jon</span></a></span> It would appear I never posted here my design improvements for inOui. I sent it to the <a href="https://urbanists.social/tags/TGV" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>TGV</span></a> CM on twitter, just got a standard reply. It would *seem* TGV M and Oxygène EMUs will have a slightly better design but I fear it may not be enough. (haven't seen it in person yet)</p><p>**Everytime** I take a TGV, people sit in the wrong rows. It's usually not that big a deal, but the confusion and mild chaos are time consuming for everyone. With the occasional asshole that makes a whole fuss. <a href="https://urbanists.social/tags/ui" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ui</span></a> <a href="https://urbanists.social/tags/uiux" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>uiux</span></a></p>
Break3 Studios<p>More sneak peeks from the BETA version of the new VEX.blue website 🌀</p><p>Our Services page just got a fresh coat of paint; Redesigned to help you more easily explore what we offer, from digital tools to platform support.</p><p>👉 Available now exclusively on our BETA site: <a href="https://new.vex.blue/services" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="">new.vex.blue/services</span><span class="invisible"></span></a></p><p>We’d love your thoughts on the new layout!</p><p><a href="https://mas.to/tags/WebsitePreview" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebsitePreview</span></a> <a href="https://mas.to/tags/BETA" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>BETA</span></a> <a href="https://mas.to/tags/NewDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>NewDesign</span></a> <a href="https://mas.to/tags/VEXblue" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>VEXblue</span></a> <a href="https://mas.to/tags/Services" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Services</span></a> <a href="https://mas.to/tags/UXDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UXDesign</span></a> <a href="https://mas.to/tags/DarkMode" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>DarkMode</span></a> <a href="https://mas.to/tags/DigitalServices" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>DigitalServices</span></a> <a href="https://mas.to/tags/WebDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDev</span></a> <a href="https://mas.to/tags/NextJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>NextJS</span></a> <a href="https://mas.to/tags/TailwindCSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>TailwindCSS</span></a> <a href="https://mas.to/tags/FrontendDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>FrontendDesign</span></a> <a href="https://mas.to/tags/ResponsiveWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>ResponsiveWeb</span></a> <a href="https://mas.to/tags/IndieDev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>IndieDev</span></a> <a href="https://mas.to/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p>
Mario Alberto Guzmán<p>My own HIG guidelines do prohibit this... and honestly it can be done so easily using NSGridView.</p><p>At least in MY guidelines, helper text to a Checkbox should in secondary color and perfectly aligned with the title. Not with the checkbox, not doing its own thing, but with the title.</p><p>• <a href="https://marioaguzman.github.io/design/layoutguidelines/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">marioaguzman.github.io/design/</span><span class="invisible">layoutguidelines/</span></a><br>• <a href="https://developer.apple.com/documentation/appkit/nsgridview" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">developer.apple.com/documentat</span><span class="invisible">ion/appkit/nsgridview</span></a></p><p><a href="https://mastodon.social/tags/AppKit" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AppKit</span></a> <a href="https://mastodon.social/tags/macOS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOS</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p><p>First picture is of Apple Photo's Settings window. The second image is an example of my own HIG document.</p>
Kagan MacTane (he/him)<p>UX designers (which includes nearly anyone developing front-end code, whether it's in your job title or not), remember that real people will have to use your interface. It will affect them. It can have a serious impact on their quality of daily life.</p><p>Don't drive your users to this: <a href="https://mastodon.online/@nikitonsky/114672417919925192" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">mastodon.online/@nikitonsky/11</span><span class="invisible">4672417919925192</span></a></p><p><a href="https://wandering.shop/tags/UI" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UI</span></a> <a href="https://wandering.shop/tags/UX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UX</span></a> <a href="https://wandering.shop/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://wandering.shop/tags/UXDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UXDesign</span></a> <a href="https://wandering.shop/tags/BadUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>BadUX</span></a> <a href="https://wandering.shop/tags/BadUXDesign" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>BadUXDesign</span></a> <a href="https://wandering.shop/tags/FrontEnd" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>FrontEnd</span></a> <a href="https://wandering.shop/tags/webdev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>webdev</span></a> <a href="https://wandering.shop/tags/WebDevelopment" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WebDevelopment</span></a></p>
Mario Alberto Guzmán<p>I really need the design team at Apple to think real hard when making new design systems.</p><p>Visually stacked items on the Z-Axis does not do you favors when it comes to a 2D display.</p><p>You can’t distinguish what elements goes with what view. <a href="https://mastodon.social/tags/macOSTahoe" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOSTahoe</span></a> doubles down on layering on the Z-axis more than ever before.</p><p>Both Apple and 3rd party devs now have to come up with fixes to address this mess. Like the new NSBackgroundExtensionView in <a href="https://mastodon.social/tags/AppKit" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AppKit</span></a>.</p><p><a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://mastodon.social/tags/WWDC25" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WWDC25</span></a> <a href="https://martianbase.net/@mackuba/114684169532147576" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">martianbase.net/@mackuba/11468</span><span class="invisible">4169532147576</span></a></p>
Mario Alberto Guzmán<p>Just go back to earlier versions of iTunes. Ignore any ideas of it looking "outdated" — look how all the controls fit nicely on a full-window-width toolbar. Clearly labeled. You will NOT mess up here in using iTunes.</p><p>The ONLY thing to lose real estate is by resizing the window; not resizing any sidebars. *THIS* is good/standard design. How did we stray away from such basic UX?</p><p>That's the part I don't understand.</p><p>AND they used bottom bars too!!! Design that WORKS.</p><p><a href="https://mastodon.social/tags/iTunes" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>iTunes</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://mastodon.social/tags/macOSTahoe" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOSTahoe</span></a></p>
Mario Alberto Guzmán<p>I know, I keep coming back to this. And this isn't about Liquid Glass...</p><p>I think we're in this awful state of layouts because of full-height sidebars and compressing the title bar into the toolbar.</p><p>Full-height sidebars do not aid in anything. They just serve to eat more of your toolbar space. When you mix that with combining the toolbar with the titlebar -- well you end up with no space at all...</p><p>I think this forced Apple Design to moving player controls to the bottom. <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://mastodon.social/tags/macOSTahoe" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOSTahoe</span></a></p>
The Iconfactory<p>Peeking through the Liquid Glass: From usability to branding, we explore what Liquid Glass means for designers and developers in our latest post.</p><p><a href="https://blog.iconfactory.com/2025/06/peeking-through-the-liquid-glass/" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">blog.iconfactory.com/2025/06/p</span><span class="invisible">eeking-through-the-liquid-glass/</span></a></p><p><a href="https://iconfactory.world/tags/WWDC" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>WWDC</span></a> <a href="https://iconfactory.world/tags/LiquidGlass" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>LiquidGlass</span></a> <a href="https://iconfactory.world/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://iconfactory.world/tags/Accessibility" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Accessibility</span></a> <a href="https://iconfactory.world/tags/NeoRetro" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>NeoRetro</span></a></p>
Stefan Habel<p><span class="h-card" translate="no"><a href="https://mastodon.social/@marioguzman" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@<span>marioguzman</span></a></span> How things have changed:<br>“If you do include icons in your menus, include them only for menu items for which they add significant value; don't include them for every menu item. A menu that includes too many icons (or poorly designed ones) can appear cluttered and be hard to read.”<br>— Using Icons in Menus, Apple HIG 2005-2009</p><p><a href="https://mastodon.social/tags/macOSTahoe" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOSTahoe</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://mastodon.social/tags/Apple" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>Apple</span></a> <a href="https://mastodon.social/tags/HIG" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>HIG</span></a></p>
Mario Alberto Guzmán<p>I’ve said it before and I’ll say it again — the best designers aren’t in Cupertino. Partly because Apple is too stubborn to hire fully remote employees. </p><p>But also this. This is infinitely better than what they currently ship. It’s a lot more harmonious with the elements within the playlist header view and makes far better use of the real estate — and while I still have questions, it’s a far better start. Tuomas’ work is always *chef’s kiss*.</p><p><a href="https://mastodon.social/tags/AppleMusic" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AppleMusic</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a> <a href="https://mastodon.social/tags/macOS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOS</span></a><br><a href="https://mastodon.social/@tuomas_h/114649439797022064" rel="nofollow noopener noreferrer" translate="no" target="_blank"><span class="invisible">https://</span><span class="ellipsis">mastodon.social/@tuomas_h/1146</span><span class="invisible">49439797022064</span></a></p>
Mario Alberto Guzmán<p>And same goes for playlist views. When did it become more acceptable that the playlist metadata was far more important than the music content itself?</p><p>I don't need the artwork and titles to be that huge.</p><p>I sorta like the solution I did for my old "marioTunes" app (lol) a while back. It was a small header with the title, description, and artwork in that playlist as the background (3rd screenshot).</p><p>Allows plenty of room for editing your playlist.</p><p> <a href="https://mastodon.social/tags/macOS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOS</span></a> <a href="https://mastodon.social/tags/iTunes" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>iTunes</span></a> <a href="https://mastodon.social/tags/AppleMusic" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AppleMusic</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p>
Mario Alberto Guzmán<p>It's crazy how much Apple's music app has regressed on macOS. Look how well they made use of available space when opening an album in iTunes while still preserving the artwork. All while still being in the context of browsing your albums.</p><p>Music.app, on the other hand, nothing but useless whitespace and awful use of space -- especially on smaller displays like the MacBook Air.</p><p>They also removed the fun theming based on the artwork.</p><p><a href="https://mastodon.social/tags/macOS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOS</span></a> <a href="https://mastodon.social/tags/iTunes" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>iTunes</span></a> <a href="https://mastodon.social/tags/AppleMusic" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>AppleMusic</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p>
Mario Alberto Guzmán<p>This is how all banners should work in macOS... where the buttons always show instead of the "on hover" bs (that is also so finicky)... Just show me the buttons broooo... I like to see what my options are up front and click the right one rather than finding out when I finally get to getting the drop down button to work correctly. </p><p><a href="https://mastodon.social/tags/macOS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>macOS</span></a> <a href="https://mastodon.social/tags/UIUX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#<span>UIUX</span></a></p>