...



Francesco Bertocci

Sr. Product/UX/UI Designer

Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Export Artboards and pages for print with this official plugin from Sketch

You can choose to show Artboard names, shadows and prototyping links, allowing you to quickly export user flows and UX overviews. This makes it super simple to see and share your whole user flow with shareholders, colleagues and other designers, saving time and streamlining your workflow. Check out the exported version of our Prototyping Template below to see what it looks like — prototyping links included!









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Design Systems articles on building and maintaining design systems

#DesignSystems #UIDesign #BestPractices #Productivity #Figma

A Figma publication for design systems creators, designers, developers, and managers









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Roller by Toybox

#Sketch #Productivity #Plugins

Introducing Roller by Toybox

Roller is the first Linter for Designers. It works just like spell-check but within your Sketch files - helping you and your team identify design inconsistencies and suggesting edits while you work.

Download the zip to get started, view the documentation below to learn more :)










Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Design Systems Repo | A Collection of Design System Resources

#DesignSystems #Resources

An organized and frequently updated collection of Design System examples, resources, tools, articles and videos.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


FreeSpace Sketch Plugin: Evenly space selected Layers, Groups, Artboards and Symbols by a defined amount.

#Sketch #Plugins #Productivity #UIDesign

I created this plugin because the built in "distribute" tool wasn't giving enough control and the "grid" tool being very powerful requires more settings than I want to deal with every time. 

Evenly space – vertically or horizontally – selected Layers, Groups, Artboards and Symbols by a defined amount:

1) Select the elements
2) Press Command + Alt + Shift + S
3) Enter a spacing value

Enjoy!
Francesco









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Sketch 53 is now live! Major improvements in symbol overrides managements.

#Sketch #Releases #Productivity

Sketch 53 has just been released! The productivity improvements are in the way overrides are now managed.

  • Override Management
  • You can now manage which overridable properties appear directly in the Symbol’s master.

  • Overrides
  • Overrides in Symbols can now be selected via the Layer List, and in the Canvas when the Symbol instance is selected.

Plus tons on other performance improvements. Some of my faves below:
  • Added the ability to navigate directly to a nested Symbol’s master from the Inspector
  • Color presets added to Document Colors are now included in Libraries
  • Grid and Layout visibility can now be toggled for all selected Artboards
  • Support has been included to view color values in HSL
  • Solid color presets are now visible when viewing the gradient picker









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Gartner: Design Patterns (Sketch Library Demo)

#DesignPatternLibraries #UX #Sketch #Collaboration #Productivity







Profile image

Francesco Bertocci

Sr. Product/UX/UI...

Greenr: Personal Data Startup

#Portfolio #Mobile #UX #UI #Motion #Prototyping







Profile image

Francesco Bertocci

Sr. Product/UX/UI...

Greenr: Personal Data Startup (Sample screens)

#Portfolio #Mobile #UX #UI #Motion #Prototyping







Profile image

Francesco Bertocci

Sr. Product/UX/UI...


At The Gates Tour Dates and Concert Art

#art







Profile image

Francesco Bertocci

Sr. Product/UX/UI...


aijs.rocks

#AI #ML #JS

A curated collection of inspirational AI-powered JavaScript apps. Find examples of artificial intelligence and machine learning with Javascript









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Prototyping AI experiences with Chris Butler

#Prototyping #AI #UX

Prototyping AI experiences


Thank you for attending the presentation and AI workshop!

First, could you do me a favor?
I would love to get feedback on the tutorial. It only takes a minute and it helps me continue to improve: https://www.surveymonkey.com/r/GV9XJ9L

Slides:

References:


About Chris Butler

I help teams understand the real business problems they should solve with AI-centered solutions. The teams we work with are generally asked to “do something interesting” with the data they have. We help them avoid local maxima through happenstance correlations and focus on solving huge business problems. My background includes over 18 years of product and business development experience at companies like Microsoft, KAYAK, and Waze. At Philosophie, I have created techniques like Empathy Mapping for the Machine and Confusion Mapping to create cross-team alignment while building AI products. If you want to learn more or get in touch via email, LinkedIn, or visit http://philosophie.is/human-centered-ai.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Atomic Tutorial: Data driven Shopping cart

#Atomic #Prototyping #JS

Make a dynamic shopping cart prototype using components, data and JavaScript









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Sketch: Copy & paste layout settings

#Sketch #Plugins #Productivity

Copy layout settings from one artboard and paste into multiples artboards.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Google Material Theming in a Nutshell

#Sketch #Plugins #MaterialDesign

It starts with a powerful Sketch plugin Material Theme Editor that can potentially replace Craft, InVision, Zeplin, and supercharge the dev process with Material Components. Yep, that’s just a start…









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


SketchToPortfolio: Update your Portfolio directly from Sketch

#Sketch #Plugins #Productivity #Portfolios

Drag Sketch Artboards to your Free&Willing public feed or to a private collection of yours (portfolio, photogallery, moodboard...). Works with PNGs and JPGs as well.

Installation

Download, unzip and double click SketchToPortfolio.sketchplugin

Usage:

1) Launch the plugin: Plugins > SketchToPortfolio > Upload To Free&Willing
2) Log into your Free&Willing account (create a profile)
3) Drag Artboards from your Sketch file into the drop area. You can drag PNGs and JPGs from your desktop too.

Tips:

  • If you organize your images into a collection you have more control on the privacy as the images won't appear in your public feed but will be visible when sharing the collection's URL.
  • You can change the visibility of each image after upload too if you want
  • Adding tags to the artboard (or filename) will add tags to your post. For example the Artboard called "Mobile Home Screen #mobile #app #UIDesign" (same thing for PNGs or JPGs "Mobile Home Screen #mobile #app #UIDesign.png")

Feedback

Please tweet at @fbmore or shoot me an email at Francesco@FreeAndWilling.com









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Atomic: Dynamic Shopping Cart Prototype

#Atomic #Prototyping #Advanced

Make a dynamic shopping cart prototype using components, data and JavaScript.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Chestnut Flour Crepes (Necci) with Ricotta and Honey Recipe & Video | Martha Stewart

#Recipes

Mario Batali prepared Chestnut Flour Crepes (Necci) with Ricotta and Honey on "The Martha Stewart Show."









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Stackswell: Bringing CSS smarts to Sketch

#Sketch #Plugins #RWD #Typography

As designers, we have made lots of headway in improving the speed at which we produce responsive designs. Over the last 5 years our industry has adopted new layout tools, perfected flexible grids and…









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Are You Choosing the Best Cut of Beef for Your Steak?

#Private #Cooking #Grilling

You can have that luxurious steakhouse experience right in your own kitchen. Cooking a perfect, juicy steak starts with choosing the right cut.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Sketch 49: Find and Replace colors everywhere! – Design&Prototype – Medium

#Sketch #Tutorials #Articles

– You were in the exploratory phase and now you want to clean things up 🗑(Or simply you haven’t paid too much attention to the colors you’ve been using – it happens to the best of us! 🤪) – You are…









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Frame your artboard with a mobile device or desktop browser.

#Sketch #Plugins #Mockups #Productivity

GitHub is where people build software. More than 27 million people use GitHub to discover, fork, and contribute to over 80 million projects.









Profile image

Francesco Bertocci

Sr. Product/UX/UI...

Workshop: Mastering Sketch

#Sketch #Workshops #NYC #Advanced

This workshop is for for anyone that has already working experience with Sketch and would like to improve or master it.

You'll be learn about resizable Symbols, Plugins, Pattern Libraries and more.

Agenda (3hrs):
– Sketch’s UI: Shortcuts and plugins for navigating folder structures and organizing layers and artboards.
– Styles: Text and Shapes (import/export to share with others)
– Advanced Symbols: How to create nested symbols for creating Design Pattern Libraries (DPL) using Atomic Design principles
– Practical tips for DPLs (lessons learned)
– Managing projects and symbol libraries with Abstract or Kactus
– Naming conventions and exporting (including exporting to SVG)
– Plugins: Manage and leverage plugins for an efficient workflow (Runner, Rename it, Anima Autolayout, Launchpad and more)
– Anima's AutoLayout: building responsive layouts, grids, tables and more.

Time and Date:
– 5:00pm to 8:00pm
– Upcoming Thursday (Date to be announced when we reach the quorum, spread the word and you both get $10 off!)
– Location: Either 135 Bowery or 26 Broadway or in SoHo.

Location:
Manhattan, NY. The exact location to be announced prior to the workshop.

Please note:
– Bring your laptop to follow along and pre-install Sketch 48 or higher (Free trial).
– Each workshop is tailored to needs and pace of the group.
– We require at minimum of 5 attendees, so spread the word! Max 10 students per event.
– Refunds: You can request a refund or save a spot for the following scheduled date. You can cancel anytime up to 48 our prior the event. 

Questions?









Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Gartner Design Pattern Library

#Portfolio #DesignPatternLibraries #UX







Profile image

Francesco Bertocci

Sr. Product/UX/UI...


Greenr + Personal Data Startup

#Portfolio #Mobile #UX










Scan & Share
Feed