Littlelines Blog

Say Hi to Jeremy!

beth-littlelines — Mon, 03 Dec 2012 11:51:14 -0500

We are happy to host a very talented young designer for the next three weeks. Jeremy Purvis is from Cincinnati, Ohio and is currently a second year student at the School of Advertising Art in Kettering Ohio. He will be helping us with web design and a chance to test his skills in a little front-end development as well.

Jeremy has a background in fine arts and computer graphics, which has lead him to his ultimate passion - graphic design. He is most excited to experience working day in and day out in a creative and fund business environment while externing with us. Besides designing in Illustrator Jeremy loves to play guitar and bike ride BMX style of course in his spare time.

We can’t wait to see what we can teach Jeremy over the next couple weeks and also to see what we might in turn learn from him.

How We Built Floatt in Two Days

mattsears-blog-deactivated20170 — Mon, 05 Nov 2012 13:09:47 -0500

The Littlelines team participated in the 2012 Rails Rumble a couple weeks ago. Rails Rumble is a competition to build and design a web application with Ruby on Rails in less than 48 hours. Teams consist from one to four members from around the world. This year was the largest Rails Rumble yet with 500 registered teams! Our team included myself, Chris, David, and Beth as the designer.

Days leading up to the competition, we had several team meetings to toss around a few ideas and strategies. Some ideas included a holiday gift registry, a web app for finding pets adoptable in your neighborhood, and an simple code collaboration tool. In the end, we overwhelmingly decided on a idea that was both simple and useful.

Floatt, as the homepage says, is a simple way for friends to stay informed on funds borrowed and split in your daily life. For example, say you pay for pizza among a group of friends, Floatt provides a simple and friendly way to keep track of who owes you and calculates each of your friend’s share.

At the core, Floatt is built with Ruby on Rails, but there are also some key technical components required to make the application work in the real world. Being able to use Floatt on the go was a key feature we wanted from the very start. We enlisted the help from Zurb's Foundation, a responsive front-end framework, to make Floatt look and work beautifully on mobile devices.

For the rest of the development, we went to our go-to toolbox: Haml, Sass, and of course Coffeescript.

The 48 Hours

With our mission in hand, we set out a plan to build this app in 48 hours (or less). Our plan of attack was not much different than what we do for our clients: work together, focus strengths, and keep open communication at all times. For the three days of competition, our plan looked something like this:

Day One: Deploy early. The main thing we wanted to do on the first day is setup the foundation application and deploy to the server as soon as possible. That way we won’t have to scramble on pesking server issues when coming down to the wire.
Day Two: Tackle complex items. We identified the critical path during our planning sessions and set out to complete these items before the final day.
Day Three: Bug fixes, tweaks, and polish. We knew that it was going to be a time crunch no matter what, but would rather focus on making app work better than making the app just work.

In the end, time did not end up being a challenge at all. That’s not to say it was easy. We did run into a few trouble spots.

Challenges

Our first major challenge was clear from the very start. We had to configure our own server from scratch. Linode was a Rumble sponsor and in charge of running all the applications. At Littlelines, we’ve become accustomed to cloud providers such has Heroku and EngineYard and so we were a little rusting with system administration. However, with a little assistance from Linode’s “stack scripts”, we were up and running in no time.

Overall, the entire process went very smoothly and we didn’t run into any major hurdles.

Success

When the Rumble ended Sunday evening, we accomplished everything we set out to do. We learned a lot and had a blast in the process. Looking back, I attribute three key areas to our success: Planning, identify complex problems early, and constant communication with the team throughout the process.

I can’t be more proud of the Littleline’s team for building this complete application in just two days. As for Floatt, we definitely plan to continue development and have some big ideas for it’s future. Stay tuned!

Labrador - A loyal data retriever

chris-mccord-blog — Tue, 16 Oct 2012 14:27:56 -0400

We work with a wide range of database systems at Littlelines. On any given day, we can jump back and forth between PostgreSQL, MySQL, or MongoDB databases, each with its own specialized application (or lack thereof) to get a quick look at our data. Coupled with different credential sets for each of our Rails applications, this can be a cumbersome experience, especially when we just need a quick overview of our database structure or records.

Enter Labrador - A loyal data retriever for your Rails development databases.

Features

Web-based, database “agnostic” client, allowing the same interface and look and feel across entirely different database systems
PostgreSQL, MongoDB, MySQL, and SQLite support with others on the way
Quick, friendly, and customizable install with a single copy/paste into your shell

As developers, we automate away as much as possible, and Labrador is no exception to that. Labrador is a Rails app itself, and integrates with pow for a zero configuration setup, Rails application discovery, and automatic database connections. It lets us do neat things like load rubyrags.labrador.dev in a browser and have an immediate look at our local Ruby Rags development database without having to tell Labrador anything about the application’s database credentials, database system, or app location. It is a great time saver for debugging, schema reference, and quick database tweaks.

Security

Distributing a Rails app in this manner, to be run locally across many different installs, requires a few security requirements outside of the traditional Rails application setup. Most importantly, Labrador uses cookie-based session storage. Typically, a Rails app uses a random string for signing cookies that is checked into version control. Since Labrador is distributed for many to use, hard-coding a secret token for session storage would leave the application’s authenticated sessions vulnerable since an attacker would know how to sign his/her own cookie and potentially gain unauthorized access to a developer’s local databases. Labrador prevents this scenario by looking for a secret_token.yml file when the application starts up. If it does not exist, it writes a random secret token to this file and references it upon subsequent application startups.

# config/initializers/secret_token.rb 
unless File.exists?("config/secret_token.yml")
  File.open("config/secret_token.yml", "w"){|f| 
    f.puts SecureRandom.hex(rand(50) + 50).to_yaml 
  }
end
token = YAML.load(File.read("config/secret_token.yml"))
Labrador::Application.config.secret_token = token

Labrador will also refuse to allow database connections unless it is provided HTTP Basic Authentication credentials, which must be entered as part of the application’s install process.

Coming Soon

Labrador has some exciting features in the pipeline and already serves us well for our day to day debugging needs. Install Labrador or checkout the codebase, and be sure to stayed tuned for new features:

Arbitrary queries
Manual database connections
Redis support

Littlelines Responds

david-stump — Fri, 31 Aug 2012 10:32:56 -0400

Ever since I read the blog article by Ethan Marcotte and heard people at conferences start murmuring about this new idea called ‘Responsive Design’ I have been hooked. This interest went deep enough to warrant a number of papers throughout my graduate school career devoted to analyzing the recent trends surrounding responsive and adaptive design. Needless to say I was thrilled when I found out that my new co-workers shared every bit of my enthusiasm. They had styled their very own site, http://littlelines.com in a mobile-first, responsive manner and it looked great on every device I could find to play with at home (I’m a self-titled professional geek so that gadget list is not inconsequential).

Upon checking out some of their source code I stumbled across a snippet that I thought was worthy of its very own blog post. During the initial development of their new site, they had setup their own custom SASS mixin to handle device detection. A mixin in SASS is a chunk of CSS that is reusable similar to a reusable method in Object Oriented Programming.

=respond-to($device)
  @if $device == handheld
    @media only screen and (min-width : 320px)
      @content

  @if $device == tablet
    @media only screen and (min-width : 600px)
      @content

  @if $device == tablet-landscape
    @media only screen and (min-width : 600px) and (orientation : landscape)
      @content

  @if $device == tablet-portrait
    @media only screen and (min-width : 600px) and (orientation : portrait)
      @content

  @if $device == tablet-large
    @media only screen and (min-width : 768px)
      @content

  @if $device == desktop
    @media only screen and (min-width : 1024px)
      @content

  @if $device == desktop-large
    @media only screen and (min-width : 1824px)
      @content

  @if $device == retina-display
    @media only screen and (-webkit-min-device-pixel-ratio: 2)
      @content

This mixin not only handled all device detection (via media queries), but did so in a mobile-first approach. This approach involves tackling the challenges of styling the mobile version of a site first and increasing in size from there (e-book, tablet, desktop, etc). Traditionally, when using media queries in CSS to handle device detection, all of the styles for a particular device are chunked together in the same part of the stylesheet. With the custom mixin, you are able to append a responsive style (using +respond_to(device_type)) within any specific style rule in SASS. This makes it quicker and easier to find and read any styles for a given site or application as all rules for a particular element are in the same place regardless of device. Ultimately, this makes adjusting a design to fit a myriad of devices second nature when tackling front-end development. This ensures continued focus on making sure site and applications give users an enjoyable experience regardless of their context or device of choice.

Below is a short example of the custom SASS mixin we use. Feel free to use/modify these snippets on your own projects - your mobile users will thank you!

h2
  color: #523611
  font-weight: bold
  margin-bottom: 1.0em
  +respond-to(handheld)
    font-size: 1.0em
    text-align: center
  +respond-to(tablet)
    font-size: 1.2em
    text-align: left
  +respond-to(desktop)
    font-size: 1.5em

The Little Things

beth-littlelines — Fri, 17 Aug 2012 11:35:00 -0400

This week here at Littlelines we have been cranking away non-stop on client code and making things function oh so nicely for them. It’s nice having clients that care so much about their work and want to be involved every step of the way. It keeps us working, and continually trying to satisfy ourselves and our clients.

We got a little break yesterday when we received a package here at the office. Excited we all stopped (which means glanced over as we continued to work) while Matt opened the large box. And to our amazement the item inside was packed with pink packing peanuts! Okay maybe only to my amazement and Matt’s annoyance of the thought of how not to get these packing peanuts everywhere.

He couldn’t, so he embraced it. Pink packing peanuts was our exciting little break from all our hard work and we loved every minute of it. Even when we applauded for the success of turning on the Apple monitor that was in the box. It’s the little things at Littlelines, like attentive clients and pink packing peanuts that matter to us and keep us going. Happy weekend friends, until next week!

Steel City Ruby Conf 2012 Wrap Up

chris-mccord-blog — Fri, 10 Aug 2012 11:32:49 -0400

A first

Pittsburgh held their first Ruby conference this past weekend, offering a welcoming atmosphere and talks for first and longtime conference goers alike. Corey Haines’ first talk on ‘Getting the most out of a conference,’ encouraged maximizing your personal connections, and with his requirement to meet a minimum of three people following his talk, was the perfect way to break the ice and get the conference rolling. As this was my first technical conference, having this kind of introduction was a great way to set my expectations and encourage meeting new people to get the most out of the weekend.

Format

There was a 30 minute intermission between each talk, a larger gap than many conferences, which allowed for a relaxed and social atmosphere following each presentation. This is something I feel is a must to really digest the previous talk and hear what others have to say. The conversations generated by a talk were often just as valuable, if not more, than the talk itself. The conference was also single track, freeing attendees over the need to pick and choose which talk to attend. Coupled with the wide area and round table seating, having everyone grouped together had a very communal feel and many people floated from table to table as the day passed.

Tolerance

I have to commend the organizers, and community as a whole, for being progressive against harassment of any kind, especially that pertaining to gender, race, and other biases. While having a zero tolerance policy on harassment may sound redundant, it made it clear to all participants that not only would this kind of behavior not be tolerated, it would be publicly scrutinized. With great programs like Girl Develop It highlighted at the conference, I think these kinds of policies and initiatives are a great step towards a more welcoming industry and something I hope generates productive discussion on eliminating such issues.

Community

For anyone in the Ruby community, I do not feel it needs to be said that there is something special about this community. I went into the conference expecting much of what I have experienced virtually; a welcoming, vibrant community, with strong OSS and TDD practices. What I left with was a group hug (hundreds strong), and a room of individuals excited to simply share in each other’s passion for the craft. Whether Aaron Pattersons’ talk on giving back, or Joe O’Brien’s talk on ‘People Patterns,’ the emphasis on the people and interpersonal relations behind the process and code was a refreshing take on software development and a perfect mix for the purely technical presentations.

SCRC2013

Steel City Ruby Conf has been confirmed for 2013, and after such a great experience, an event I do not plan on missing.

Welcome David Stump to Littlelines

beth-littlelines — Thu, 02 Aug 2012 16:59:56 -0400

We are welcoming a new member to the Littlelines team this week.

David Stump hails from Indiana and we are happy to call him our new front-end developer with a liking for Ruby. A graduate from Butler University, he recently earned a Masters of Science in Human Computer Interaction from DePaul University, College of Computing and Digital Media. Now if that isn’t experience enough for you, David worked at a tech start-up in Cincinnati and was responsible for all the front-end development. His experience doesn’t stop there though, David once got offered a Subway sandwich from Jared the Subway guy.

User experience, good design, and front-end development are just a few of his passions. Some of his recent personal projects include a social calendar application centered on Facebook events and birthdays (Facebook just released this same functionality in the past few weeks), and a Netflix API application geared toward presenting the user with Best Picture nominees from any given year and directing them to the streaming Netflix link.

When David is not collaborating or creating, he is attending his favorite college basketball games, drinking coffee, playing drums, gaming on all kinds of platforms, and traveling all around the world with his wife Gwyn.

David is looking forward to incorporating some of the passion for all around user experience and his fancy front-end development skills at Littlelines while dabbling in some Ruby along the way.

Happy Birthday Littlelines

mattsears-blog-deactivated20170 — Fri, 27 Jul 2012 07:39:00 -0400

It’s more than hard to believe that Littlelines has been in business for over five years. We’ve not only been pleasantly busy, but we’ve amassed an amazing roster of clients with such awesome ideas that we can’t help but be proud. We’ll not go so far as calling these projects “our children”, but it’s something like that. After all, they have been released unto the world from our technical and creative cradle, right?

In the beginning we started with a simple idea: craft amazingly beautiful websites. In a very short amount of time, our small company with our eye for design and cutting edge technology has produced some stellar software. Amidst the chaotic and exciting schedules, we redesigned our company site earlier this year. We asked ourselves how does one give voice to a site that is meant to give voice to others? In the end it came to buckling down and asking the question: “Where do we shine?” With hardly a thought, we knew that the answer once again pointed to that single, crucial element: Our clients. We’ve built some very strong relationships over the past five years, and even made a few friends along the way.

Here’s to the next five years.

Steel City Ruby Conf is almost here

mattsears-blog-deactivated20170 — Sun, 22 Jul 2012 20:12:00 -0400

In just a couple weeks Littlelines will be making a road trip to Pittsburgh for the Steel City Ruby Conf. The event will be held Aug 3rd-4th downtown in the Heinz History Center.

Check out a snippet from the site:

Steel City Ruby Conf is a single-track conference. That means everyone attending the conference has the same shared experience and there’s no need to worry about choosing between two awesome talks. Each talk is only 30 minutes with a 30 minute break in-between to allow for the all-important Hallway Track™. We believe the hallway track is just as important as the speaking track, so we devote an equal amount of time to each

In addition to sponsoring the event, Littlelines had the dubious honor of designing the t-shirts. Now, we have a lot of experience with making shirts, but this was our first foray into conference shirts.

To say the least, we are quite pleased with the results and can’t wait to hand them out in Pittsburgh! If you want to following along, follow @littlelines and @steelcityruby on Twitter.