From
smashingmagazine.com
Email Address
newsletter@smashingmagazine.com
Sent On
Tue, Jul 26, 2022 12:34 PM
Email Preheader Text
Useful little helpers for the command line, better thinking, maps, SVG, interface copy and timing. I
HTML
Useful little helpers for the command line, better thinking, maps, SVG, interface copy and timing. Issue #363 ⢠July 26, 2022 ⢠[View in the browser]( ð¨ [Smashing Newsletter]( Dobar dan Smashing Friends, Who doesnât look for a good little front-end tool every now and then to improve their productivity? In this issue, we have just a few: command line gems, tools for better thinking, better maps, understanding SVG, better interface copy and timing. Weâve also published a round-up of [powerful little helpers on SmashingMag]( so feel free to dive in when you have a moment. As weâve [came back from SF]( we are now very much getting ready for our next conferences this year. Coming up next is our lovely [SmashingConf Freiburg 2022]( in our hometown Freiburg, Germany, on Sep 5â7, with plenty of sessions and workshops around accessibility, CSS/JS, design systems and good olâ front-end. [Oh my, itâs happening again! After two years, SmashingConfs are finally back. Photo by wonderful Marc Thiele.](
Oh my, itâs happening again! After two years, [SmashingConfs are finally back](. Photo by wonderful [Marc Thiele](. Afterwards, we head to New York for [SmashingConf NYC 2022]( on Oct 10â13 with sessions on animation, CSS, accessibility, Web3 and so many other things. There are some lovely workshops as well. We canât wait — and we canât wait to see you there! In the meantime though, off we go exploring all those little friendly front-end tools — happy stumbling, everyone! :) — Vitaly ([@vitalyf]( --------------------------------------------------------------- 1. Terminal Gems Sometimes itâs the regular tools that surprise us the most. What can be that surprising in a good olâ Terminal? As Jamie Smith has [discovered]( we can check the calendar and weather forecast right from the command line. [Terminal Gems]( cal -3 in the Terminal returns the current and surrounding months, but you can also check the calendar for the whole of 2022 with cal 2022. We can also use curl germany to receive a weather forecast in your city with a convenient ASCII preview. Beyond that, there is plenty of [useful plugins]( and [improved setup for the Terminal]( along with Joshâs [Front-End Developer's Guide to the Terminal]( and a lovely Terminal documentation site [DashDash.io](. And if you need even more tooling, Louis has got your back with [Powerful Terminal And Command-Line (CLI) Tools For Modern Web Development](. (vf) --------------------------------------------------------------- 2. Tools For Better Thinking There are plenty of digital tools out there to ease a designerâs life — tools for UI design, prototyping, whiteboarding, and much more. But what about one of the most crucial parts that the job as a designer brings along: thinking? As designers, we need to solve problems and make decisions on a day-to-day basis. Am I solving the right problem? Which option is the best one? What would be the long-term consequences of my decision? Well, thinking tools can help us find answers to questions like these. A wonderful overview of such tools comes from Adam Amran: [Untools](. [Untools]( Untools is a collection of thinking tools and frameworks to help you solve problems, make decisions, and understand systems. From the Minto Pyramid to the Hard Choice Model, the tools cover systems thinking, decision making, problem-solving, and communication. A guide helps you choose the right tool for your needs. One for the bookmarks. (cm) --------------------------------------------------------------- 3. Collaborative Mapping Tool Maps on the web donât need to be boring, and they donât need to be hard to create either. Bringing the simple elegance of modern creative software to maps, the collaborative mapping tool [Felt]( is here to hold up to this promise. [Felt]( Currently in public beta and free to use for individuals, Felt provides smart tools that make creating maps as easy as drawing on paper, while photos, links, and videos make your maps internet-native. When creating a map, you can bring in your own data or rely on a built-in library of more than 50 data layers (for information on flood hazards or wildfires, for example). Sharing is simple, too: Every map has a unique link you can share with your team (for live multi-user editing) or the public. No matter if you need to map out the way from the train station to an event venue or visualize evacuation areas in case of natural disasters, Felt has got your back. (cm) --------------------------------------------------------------- 4. Upcoming Online Workshops Thatâs right! We run [online workshops on frontend and design]( be it accessibility, performance, navigation, or landing pages. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well. [Smart Interface Design Patterns](
Meet [Smart Interface Design Patterns]( our 7h-video course with 100s of real-life examples. [Free video preview](. - [Smart Interface Design Patterns]( a 7h-video course with Vitaly Friedman,
- [Interface Design Patterns UX Training]( taking place in September 2022. Last early-bird-tickets. [Smashing Online Workshops](
With [online workshops]( we aim to give you the same experience and access to experts as in an in-person workshop from wherever you are. As always, hereâs an overview of our [upcoming workshops]( - [The React Performance Masterclass]( Dev
with Ivan Akulov. July 28 – Aug 11
- [Designing The Perfect Web Forms]( UX
with Vitaly Friedman. Aug 29–30
- [Designing Better UX With Top Tasks]( Workflow
with Gerry McGovern. Sept 13–27
- [Designing Better Products Masterclass]( UX
with St̩phanie Walter. Sept 21 РOct 5
- [Optimistic UI Masterclass]( Dev
with Zell Liew. Oct 6–14
- [Designing for Emotion Masterclass]( UX
with Aarron Walter. Oct 17–18
- [Jump to all workshops →]( --------------------------------------------------------------- 5. SVG Path Visualizer How does SVG work again? Once you are given a source code of an SVG file, would you be able to decipher what exactly is going on there? Probably not. But when it comes to debugging or quick changes, itâs useful to do so. Cassie Evans has created a little [Logo Turtle]( with SVG path commands, visualizing the SVG syntax in a little demo. Cassie also demystifies the SVG syntax with Jake Archibald in a [15-min video](. [SVG Path Visualizer]( With [SVG Path Visualizer]( you can enter an SVG path data (the string inside the d attribute) and the tool explains the magic happening behind the scenes in a human-understandable language. And you can make some fine adjustments using [SVG Path Editor]( as well. And if you need more SVG tools and generators, weâve got your back with a [round-up of SVG generators](. (vf) --------------------------------------------------------------- 6. Just When You Need A Copy Sometimes coming up with just the right words is difficult. And sometimes you need just a bit of inspiration to start looking in the right direction. [Copybook]( tries to help with just that. [Copybook]( The tool gathers various examples of interface copy, all tagged and grouped by categories and mood. There is also search available, so you can find something specific for a confirmation message, errors or upsell. If you need a few more tools [SpeakHuman.today]( generates human-centric microcopy for all your needs and [UIcopy]( is a nifty plugin for Figma and Adobe XD with pre-built copy templates. Plus, donât forget [Tiny Words Matter]( a friendly Twitter account that provides a curated dose of well-crafted microcopy, too. (vf) --------------------------------------------------------------- From our sponsor Northwesternâs Online MS in Information Design and Strategy [Northwesternâs Online MS in Information Design and Strategy](
Prepare for a range of dynamic communication roles and build the skills needed to lead communication strategy, translate complex data, and drive user interactions. Choose from specializations in content strategy, UX/UI, communication with data, and learning design. [Learn more](. --------------------------------------------------------------- 7. Productivity Timers We all like to be productive, but being productive requires a certain level of organization and discipline. One little thing that has been immensely helpful for me is the focus time. Just before I start out with a task, I set up the time until when Iâd love to complete the task, and set up a timer — or hourglass — for that task. [Anotherpomodoro]( [AnotherPomodoro]( helps you to achieve it seamlessly. It has various views and timers, supports multiple tasks, and you can even schedule a timer ahead of time. [BigTimer]( is similar, but itâs larger and much simpler — great for meetings or just general time-tracking. Helpful! (vf) --------------------------------------------------------------- 8. New On Smashing Job Board - [Senior Frontend Web Developer](
at Software Engineering Institute (Pittsburgh , PA)
- [Product Design Lead](
at Futurehome AS (Oslo, Remote)
- [Director of Marketing](
at Motionpoint Corp (Coconut Creek, FL) --------------------------------------------------------------- 9. Recent Smashing Articles - [ vs. : How To Choose The Right One](
- [Overcoming Imposter Syndrome By Developing Your Own Guiding Principles](
- [Looking Back At SmashingConf SF 2022](
- [Powerful Image Optimization Tools](
- [Read more articles on Smashing Magazine →]( --------------------------------------------------------------- Thatâs All, Folks! Thank you so much for reading and for your support in helping us keep the web dev and design community strong with our newsletter. See you next time! --------------------------------------------------------------- This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf) and Iris LjeÅ¡njanin (il). Sent to truly [smashing]( readers via [Mailchimp](.
We sincerely appreciate your kind support. You rock. [Follow us on Twitter]( ⢠[Join us on Facebook]( Weekly issues with useful tips for web devs.
Email: newsletter@smashingmagazine.com. [unsubscribe]( ⢠[update preferences]( ⢠[view in your browser](
EDM Keywords (151)
written
would
wildfires
whole
wherever
well
web
way
wait
vf
useful
use
upsell
uicopy
timing
timer
time
thought
things
terminal
team
task
tagged
surprising
support
start
specializations
soon
sometimes
solving
smashingmag
simple
similar
share
sf
set
sessions
see
seamlessly
scenes
round
right
rely
receive
reading
range
public
provides
productivity
productive
probably
plenty
paper
overview
organization
option
one
next
needs
need
much
mood
moment
meetings
matter
marketing
maps
map
many
make
love
look
like
library
larger
know
josh
join
job
issue
inspiration
information
improve
hourglass
hold
help
head
hard
happening
guide
grouped
got
going
given
give
generators
futurehome
frontend
free
frameworks
figma
fact
experts
experience
exactly
enter
edited
easy
ease
drawing
dive
discovered
difficult
developing
designers
designer
design
decipher
debugging
day
data
current
creating
created
couple
copybook
complete
communication
comes
collection
city
choose
check
categories
case
calendar
built
build
browser
bring
boring
bit
back
attribute
articles
always
aim
achieve
access
able
2022
100s