...



Francesco Bertocci

Sr. Product/UX/UI Designer

Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Data visualization Dos and Don’ts

#DataViz #Tips #MaterialDesign







Profile image

Francesco Bertocci

Sr. Product/UX/UI...


See Google's first guidelines for data visualization

#DataViz #Tips #Google

Think of it as Material Design for data visualization. 









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Accot-Zhai Steering Law: Implications for UI Design

#UIDesign #UX #Usability

Dropdowns, hierarchical menus, sliders, or scroll bars involve steering a pointer or a cursor through a tunnel; optimal design for these GUI elements should consider the Steering Law.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Goopy: Studio

#AR #Tools #Productivity

Our Mission is to make AR content simple, scalable and flexible









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Preview: Sketch to React and Developer-friendly Code. Announcing Anima 4.

#Sketch #React #AnimaApp #Dev #Productivity

Anima is the fastest way from design to production. By converting web design to code, we bridge communication between designers and developers. This results in boosted productivity and…









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Pock: Display macOS Dock in Touch Bar

#OSX #Productivity #Tools

Display macOS Dock in Touch Bar.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


SwiftUI Tutorial: Build a dynamic list app with navigation and images

#iOS #SwiftUI #Dev #Mobile #Free #Tutorials

Ready to get started with SwiftUI? In this tutorial you'll learn how to build a scrolling table of items, how to handle selection, how to create a new screen...









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


R/GA: Mimica - more accurate expiration date, less wasted foods

#Innovation #

R/GA is a full service digital agency creating products, services and communications to help grow our client's businesses in the connected age.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Artboard-manager: Automagically rearrange Artboards

#Sketch #Plugins #Productivity

This plugin automatically arranges the position of all Artboards in your Sketch document, to snap them to rows & columns.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Build an app with SwiftUI (20% Preorder discount)

#iOS #MobileDev #Tutorials #Courses

Learn how to create beautiful layouts, UI animations and interactions using SwiftUI and Xcode 11. A course for designers and beginners.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


🌈 FreeFlow for Sketch (Donate)

#FreeFlow #Donation

We ❤️ building FreeFlow to help you be more efficient with Sketch!
Your support helps us improve FreeFlow, add features as they come along, provide support and keep it up with future Sketch updates.

Thank you for your support!









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Sketch Symbol Browser Plugin

#Sketch #Plugin #Libraries #Productivity

A new way to browse your symbols. Make the most of your Design System by bringing symbols and UI Sticker sheet together.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Vectary: The Easiest Online 3D Design & 3D Modeling Software

#3D #AR #Tools

Turn ideas into 3D design with this easy-to-use online 3D modeling software. Start for free with a complete set of tools including real-time rendering and models library.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Anima ToolKit: Sketch to HTML

#Sketch #AnimaApp #Plugins #Tutorials #Resources

Learn how to Export HTML from Sketch, Design Interactions and Animations with Sketch and the Anima app plugin.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Tutorial: These tiny tweaks make your animations so much better

#Motion #UIDesign #Tips #Tutorials #InVisionStudio

What takes a product animation from good to great? Really, it’s all about the small details. Using InVision Studio, let’s […]









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Semantic UI Kit for XD: Icons & Templates for Semantic Design

#XD #UIKits #Semantic #Productivity

Build a custom design system with this kit inspired by Semantic UI. Start designing at scale with components like buttons, forms, search, tabs & more.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


An ultimate guide to designing user-friendly forms

#Forms #UX #UIDesign #Usability

An ultimate guide to designing user-friendly forms 









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Color Safe: accessible web color combinations

#Accessibility #Productivity #Tools #WCAG

Color Safe is a tool to explore beautiful, accessible color palettes for your website based on Web Content Accessibility Guidelines (WCAG).









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Accessible Interface Design

#UIDesign #Tools #Accessibility

A year ago I joined the Salesforce UX team as a Product Designer working on Mobile Self Service products. I came from a small startup, so I was new to practically everything happening at such a large…









Profile image

Francesco Bertocci

Sr. Product/UX/UI...

FitToContent Sketch Plugin (v1.1)

#Sketch #Plugins #Productivity #UIDesign

Sets the size of Symbols, Instances, Text Layers, Artboards or Groups to the size of their contents:

Works with:
👉 Artboards & Master Symbols
👉 Symbol Instances
👉 Groups
👉 Text Layers

✨ For Text Layers it resizes the text box to the correct height based on the line-height value.

📐 Applied to Symbol Instances it resets them to their original size (the Master Symbol’s size).

📂 For Groups it fixes an issue 🤕 where folders don’t match the size or position of their contents!

Enjoy! 









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


May 2019 Update of XD: Easily Create & Manage Design Systems

#XD #UIDesign #DesignPatternLibraries #Prototyping #Components

The latest version of XD allows you to build scalable design systems & easily create & manage reusable colors, styles, & components with your team.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


A Practical Guide To SVG And Design Tools (Smashing Magazine)

#SVGs #Tools #BestPractices #Sketch #Figma #Illustrator #Productivity

To make the best of SVG, it’s useful not only to learn its syntax but also to understand how SVG is generated by graphic design software. Let’€™s take a closer look at the process of generating SVG with popular design apps and how we can use them to our own advantage.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Framer Store: Web Font Plus

#Framer #Typography










Scan & Share
Feed