Creating a Ruby CLI Journal Application, Part 3: Styling, Flow, and ASCII Art

Allene Norton
4 min readOct 23, 2020

Read part one of this series here, and part two here

So we’ve made an app, and it looks like crap. SQL statements everywhere, ugly blocks of text, no color… it definitely doesn’t feel like an actual application, even though it runs like one. Let’s talk about how I took this app from SAD to RAD.

No more dad-rhymes after this point, I promise.

Styling With Gems

I admit it, I kind of went a little crazy with the gems. It isn’t a good idea to use a ton of gems in your app because they can have many dependencies and aren’t always the most reliable. I didn’t know this when I made this project, but since most of the gems were used for look and feel versus handling data, I’m not too worried about it. There are so many awesome gems out there that can really take a CLI app to the next level!

TTY Prompt and TTY Spinner: These gems rule. Prompt allows for diverse ways of getting user input. You can make menus, yes or no options, text input, radio buttons, and more. Spinner is a handy animated spinner that you can run while tasks are being performed. In our case, we used it while fetching our data from the API. You can find all of the TTY gems here.

TablePrint: This gem is what we used to render nice looking tables of the data we pulled from our database. AwesomePrint is another great gem with similar functionality.

Whirly: We included a breathing exercise in our app for a little extra pizzaz. Similar to TTY Spinner, Whirly displays animations while tasks are loading or for a set amount of time. I liked the animations that Whirly provides more than TTY, so I chose to use this for our breathing exercise sequence. The one I used displays numbers that I was able to set to one second intervals. And to color them I used the next gem …

Paint: This gem lets you breathe life into your text-based application with colors! There are other gems that do this as well, like Colorize, but I chose Paint because it worked well with Whirly.

Lolcat: This gem is what made our awesome rainbow gradient effects and text animation possible!

using lolcat gem

This was a little trickier to implement, because it is meant for terminal output instead of running Ruby files, so I had to do a bit of research and implement some extra code to get it working. Another Flatiron student wrote a great article about it here.

“But, how did you do that sweet 80s grid background?”

Well, did you know that you can change the background of your terminal to any color or image? If you’re on a Mac, go to your settings and click ‘Profiles’, and you can change it from there. If you use Windows, just throw out your computer and get a Mac.

Just kidding. Sort of. Here’s a post that has some info, but it is definitely more complicated.

Making It Flow

Timing the app functions was critical to our program feeling like an actual app instead of just a terminal. Ruby has a handy sleep function for spacing out the display of your methods. This is how we used it in our breathing exercise:

breathing exercise method

Here you can see much of what I’ve talked about so far all put together. We used lolcat to animate some ASCII art, and timed the display of text using sleep. Whirly runs an animation in between text display. Lastly, using `clear` in a puts statement will clear out the entire terminal, which makes the app feel spacious and not overcrowded with text.

Since we’re using SQLite3 for our database, the terminal will spit out a bunch of ugly statements every time you make an ActiveRecord query. To fix this, add this line to config/environment.rb: ActiveRecord::Base.logger = nil

ASCII Art

To create the large text for our title and breathing exercise, as well as the images we used for our ‘moment of zen’ method and our exit screen, we used ASCII art. ASCII art is art made from printable characters, so letters, slashes, commas, numbers, etc. For the text we used TAAG and for images we used art from ASCII Art Archive. You can also generate your own ASCII images from image files using ManyTools, although we didn’t use this because the ASCII generated can be hit-or-miss depending on the image you use.

our moment of zen :)

Conclusion

This concludes the series on my Mod 1 project for Flatiron. I know that when I started out, knowing nothing about how to program, I was pretty lost! I hope this mini-series can help anyone who is starting out with Ruby navigate the making of their first CLI application. Shout-out to my partner for this project, Christina C.!

--

--

Allene Norton

Full stack developer and Flatiron graduate who recently made the jump from a career as a professional musician and audio engineer | Austin, TX