Productivity as a DIY project

Guest Author: Mario Villacres

As I was wrapping up my time at Fullstack Academy, the future seemed bright. I had an in-demand skill set in my arsenal and after three months of drilling algorithms and learning best practices in web development, landing a position as a web developer was all but guaranteed.

And although my time in the classroom was done, I continued to get my money’s worth from Fullstack. I was assigned a career counselor who would continue to help me in my efforts to break into the world of tech, whether it be mock interviews or salary negotiation tips.

In order to make it easier for her to keep track of where I stood in the interview process with a given company, she had set up an account on Asana for me to record my progress. After trying Asana for a week, however, I was not a fan. This was not my first project management tool — I’ve used both Trello and Todoist extensively — and Asana felt cluttered by comparison.

I shared my gripes with my career counselor, she said I could simply keep her in the loop via Slack. Through this minor experience, however, I came to realize how much time I had been wasting switching between multiple services, which totally defeats the purpose of “productivity” apps.

Seeking a single source of productivity

Rather than have all my projects and tasks splintered across multiple services, I decided to consolidate all my projects onto a single platform. The only issue was which one to use.

Trello’s kanban boards were great for large-scale projects, but left much to be desired for one-off tasks (e.g. “Buy milk today”). On the other hand, Todoist’s single stream of tasks made it difficult to visualize workflow. I sought out other services that might have been a better compromise, but each service I sought out came with its own off-putting limitations (oftentimes it was the price tag).

Seeking a single source of productivity

It seems silly in retrospect. Here I was in search of a web app that would fulfill my particular needs, forgetting for a moment that I had just spent the past 3 months developing the skills I would need to build it myself! And so began my quest to build my perfect web app.

The building of Dharana

I chose the name Dharana both in reference to Asana (as both words refer to concepts from the Eight Limbs of Yoga) and as a way to describe what would be the experience of using my app — the word dharana in Sanskrit has several related meanings, including “a collection of the mind” and “uninterrupted focus.”

Tools Used

I was delighted to find out that Todoist was built with several of the same tools I had learned at Fullstack, and so I began building my app with a similar structure, adding my own twists along the way. Ultimately, Dharana’s tech stack was the following:

  • React on the front end, as each task and kanban list could easily be thought of as components
  • Redux in order to allow tasks to appear under various filtered/queried views (one of my favorite features of Todoist)
  • Node and Express on the back end for their flexibility
  • PostgreSQL as the database as the data easily lent itself to a relational structure

New faces, new influences

Anybody that has been job hunting within the past few years will tell you that it is simply not enough to get your resume circulated to the right people, your reputation also needs to make the rounds.

It’s for this reason that I began attending meetups almost daily since leaving Fullstack. One particular meetup group that I became fond of was the React NYC meetup. Every two weeks, they bring in some of the best professionals in the tech industry to give a presentation on how their companies go about using React in their online offerings. Each time I attend a React NYC event, I walk away learning something new and feeling like I’ve better refined my understanding of contemporary best practices on the front end.

Whenever I learned something that I felt would improve the experience of Dharana, I would spend the time to refactor the project; I usually ended up extremely satisfied by the results. Slowly, I began approaching my building of Dharana less as an end goal, and more as an open-ended exploration.

What’s next for Dharana?

While the current culture in tech dictates that developers must monetize everything under the sun, I’m in no rush to make Dharana into a full-blown business.

I have no doubt that Dharana could be a tool that several people might find useful in their daily lives, but for now, I’m very much content with Dharana being something that’s just for me.

Link to Mario’s Original Post on Medium

My top 5 Sketch plugins to increase productivity

The purpose of this article is to share what I think are the most valuable sketch plugins to my workflow when designing desktop and mobile screens. Enjoy!

1. Runner

Sketch Runner Plugin

Regardless of what you’re designing on Sketch, you will need Sketch runner to speed up your Sketch workflow. With this plugin, you will be able to search through all available plugins and Sketch menu commands without having to navigate through those long drop downs. You can also insert symbols, jump to any page, apply text & layer styles, and install new plugins.

2. Content Generator

Sketch Content Generator Plugin

Almost every client or project I’ve worked on has required me to populate my screens with fake data such as names, phone numbers, geo locations, profile images, etc which took a lot of my time because I had to come up with believable data off the top of my head for at least 50 rows of data. The content generator allows you to populate any number of rows of dummy data such as avatars, names, photos, geodata, etc in seconds.

3. Spell Check Whole Page

Sketch Content Generator Plugin

There are few mistakes more embarrassing allowing a spelling error slip through the cracks from design all the way into production. Spell check whole page allows you to spell check all text of every layer on the current page you are on. I also supplement this plugin by typing all of my screen text into Grammarly to check my grammar as well.

4. Merge Duplicate Symbols

Sketch Content Generator Plugin

As I have become savvier utilizing the power of Sketch symbols this tool has saved me a lot of time cleaning up my duplicate symbols from copying and pasting other symbols. This plugin allows you to merge symbols with the same name. You simply choose the one you want to keep and press OK. The other symbols will be removed, and all of their instances will be replaced by the one you choose to keep.

5. Symbol Organizer

Sketch Symbol Organizer Plugin

There comes a point where you have 50+ symbols throughout your Sketch file and you are dreading looking at the symbols page because of how messy you know it will be. Fortunately, the symbol organizer plugin organizes your symbols page alphabetically into groupings determined by symbols names in a clean grid.

Final Notes

I hope that these Sketch plugins add value to your daily workflow. What Sketch plugins have either changed the way you design or increase your productivity? Write them below!