Using SASS with Codekit, Transmit & remote stylesheets
I’ve been late to get onboard the SASS (or LESS) train, due to the majority of my projects (e.g. Tumblr themes) consist of editing stylesheets remotely. When I updated one of my existing sites at the start of this year, I worked on it locally and used the opportunity to start using SASS.
Last week I started developing a new Tumblr theme. Usually my workflow would consist of connecting through FTP in my text editor and editing the CSS from there. Save it, refresh the site and I’d see the changes.
But now I wanted to bring SASS into my Tumblr theme workflow. I’ve been using SASS with Codekit, which automatically compiles all your SASS whenever you save (it’s the best); you just have to set the location of the exported CSS file. My first thought was to figure out a way to automatically upload the compiled stylesheet via FTP everytime it was changed, as manually uploading would get tiresome very quickly.
The solution I found was a feature in Transmit where I can mount an FTP folder as a drive. Then all I had to do was tell Codekit to export the compiled CSS into that drive.
Now everytime I save one of my SASS stylesheets, it’s automatically compiled and uploaded in a matter of seconds.
Gearing up my iPad for 2013
Holiday period is over, wine was had in France and beer was had in Belgium. Now I’m refreshed and ready to dive in to 2013. I decided to take some time to spring clean my iPad as it’s going to be main tool I’ll use for learning and reading this year.
First off, I decided to sell my iPad 2 for an iPad mini. As someone who travels a lot and uses an 11inch Macbook Air for “creating”, the regular iPad size was quite pointless as the Macbook Air was pretty much the same size and weight. The iPad mini’s size bridges that gap between my phone and 11” Air that I needed. Oh, and it’s just so darn cute.
I’m just going to outline a few new items I’m going to aim to use a lot more this year. Some of these items may be new to you, some may be familiar, but at least I hope you’ll get something out of this.
This is still the be and end all of all iPad reading apps. Key feeds I have set up on Flipboard:
Twitter Favourites
This is such a hidden gem of Flipboard. I go crazy on favouriting tweets, especially when I’m on my phone, it’s probably my most used method for saving items after saving to Pocket / Instapaper. Since my Twitter favourites are a combination of articles, images, videos and even just tweets, Flipboard’s magazine style layout is the best way to go through them.
Google Reader
I mainly source most of my reading from Twitter, Tumblr and newsletters (see here), but a lot of content still falls under RSS. I finally got around to tidying up my Google Reader list, many thanks to Chris Coyier’s slides on How To Stay Up To Date With Web Stuff.
Here’s who I’ve got (open to suggestions for more!):
- 24 Ways
- A List Apart
- Adactio
- Adventures in JS Dev
- Bricss
- Christian Heilmann
- Cognition by Happy Cog
- CSS Tricks
- Daring Fireball
- Divya Manian
- HTML5 Doctor
- Paul Irish
- Stubborn Ella
- The CSS Ninja
- Web Platform
Ok so not really counting as reading, but I after viewing Instagram on your phone all day, it is nice to sit on the couch and view high resolution photos.
I’m giving this a go, instead of using Instapaper (it was easy to import from Instapaper). To be honest, I’m just happy with a change of scenery and haven’t really noticed a considerable difference between the two. One of my favourite features of Pocket is the browser extension in Chrome. With Instapaper I was just using the bookmarklet, but was hard to get to as I prefer to hide the bookmarks bar in Chrome (11” Air, you need the vertical space!). Maybe Instapaper has better typography, but I am enjoying Pocket’s magazine style feed.
Gmail and Chrome
I’ve been using Chrome for iPad for almost a week now and don’t think I’ll look back. Mainly because it can sync tabs with Chrome from my desktop (laptop).
The Gmail app can be a bit to initially load emails at times, but is very slick once you get into your emails.
Tweetbot
Still clearly the best Twitter app. Mute filters, photo previews, conversation threads and so on.
Honourable Mentions
A few apps I have tucked away into folders, but are definitely going to be taking a battering from my finger this year:
As mentioned above, will mainly use my feed in Flipboard for Google Reader articles. However I have a lot of non-web design related blogs on Google Reader which is good to go to for a change.
Spotify premium is definitely one of the best subscriptions I’ve purchased of late. Perfect for someone who travels a lot. Just needs The Beatles discography.
Pretty sure even Reddit HQ use Alien Blue instead of their own Reddit for Ipad app. It’s just loaded with so many features. It doesn’t get a position on my homescreen though as it’s one of the black holes of the internet.
Currently about a week into using this synced across all devices. It’s free and the app works as intended for a simple to-do list. The main thing is if I can keep it up (rarely do).
The best boardgame adaption on the iPad. IMO the best UI and design of a game on the iPad (I don’t play that many games though).
Just went live on an update to the Giraffic Themes website.
I felt like a facelift was needed as the old site didn’t really have that much information on each theme. With the new design, each theme has a dedicated page (example), highlighting the theme’s main features.
From Pizza museums to bus stops to graphic novel publishing, this full screen text + large image style website shows off all the amazingness that came out of Kickstarter in 2012.
Blue Monday
Only a few months ago I saw snow for the first time I can remember (on top of a mountain in Switzerland). The last few days in London has been the first time I’ve actually witnessed snowfall for the first time. I spent the whole day just walking around absorbing it. I was like a kid, everything was new to me.
Today is Blue Monday, where it’s apparently supposed to be the most depressing day of the year. Luckily, this wasn’t the case for me. Today has been one of the best days I’ve had in London, walking around still marvelling at how snow makes everyday objects become interesting.
I would have thought during these dark, cold winter months that my productivity levels may decrease. This has turned out to be the opposite. While outside activities are hitting hibernation, here’s my guide to spending a London winter morning, especially during snowfall:
- Go to your favourite coffee shop
- Try get a spot where you can see outside
- Put on some jazz
- Read, do some work, or simply just stare outside at everyone rushing around you
- Profit
It’s pure bliss I tell you.
One of my small goals for 2013 was to contribute more, so here I am with my first public repository on Github.
Tumblrplate is essentially just a naked Tumblr theme built off HTML5 Boilerplate. It’s ideal to use a base for Tumblr theme development. It’s really not anything groundbreaking, but perhaps is a starting point for future Tumblr templates/frameworks.
All assets are already uploaded and hosted on Tumblr’s static server (e.g normalize.css, Modernizr, jQuery).
Includes all post types, {RSS}, {Favicon}, {CustomCSS}, {LinkOpenTag} (for Photo posts), {MetaDescription}, and {PhotoAlt}.
Includes new structural elements in HTML5 including <header>, <nav>, <footer>, <section> and <article>.
To begin using, you may want to host your CSS and Javascript files on your own public host (like FTP or even Dropbox) and drop them into the theme.
This is intended to be just a base to begin creating a theme from, hence why there are no styles applied. See the demo here: http://boilerplatetheme.tumblr.com/
For more info on creating Tumblr themes, Tumblr’s theme documentation has always been my one and only resource: http://www.tumblr.com/docs/en/custom_themes
—————
PS thanks to Tait Brown who gave the template a bit of a polish before I launched.
Bandcamp usually keep very quiet and just let their product do the the talking. But every so often they release a new feature that makes everyone sit up and take note. They’ve just released fan accounts and as a result have a delightful network for fans to indulge themselves into.
This new fan profiles are slick. They show off what music you have bought (and therefore 100% supported the artist, well, maybe 99.8% as Bandcamp do take a slice). When I signed up I realised I only have one album in my collection and instantly wanted to have a more beefy collection like Bandcamp’s co-founder Ethan Diamond, which could have resulted in me going on a Bandcamp spending spree (luckily I took a deep breath). But the incentive is there; collect music and show off who you support.
The other great aspect of these collections is you can see what albums in your collection appears in other fans’ collections. “Oh cool 11 other fans have this album, oh this guy has a good collection”, then suddenly you’re on a Wikipedia style internet voyage.
One thing I noticed with these collections is that it looks like albums on Bandcamp that you can download for free, either outright or by entering ‘0’ on the “name your price” model, won’t come up in your collection. Their blog post doesn’t really give a reason for that either. The closest is this quote in regards to a question about there being deeper motivation at work:
If someone simply listens to a song, I frankly don’t care at all. And if someone listens to a song and then burns .01 calories tapping a Like button… well that’s slightly more interesting, but I still don’t care much. However, if someone is passionate enough about a record to spend money on it – to actually support the artist who made it, and perhaps even write a bit about why they love it – that makes me much more likely listen to that record, and perhaps add it to my collection as well.
So I can understand where they’re coming from there and it does give a fan’s collection a lot more value than “a bunch of tracks I clicked the like button on”. But, I’m an artist on Bandcamp who released an album two years ago where fans could name their price, in other words, download for free.
I chose that because I really wasn’t looking to earn money on it and just wanted my music out there. My album has 200 downloads through Bandcamp, but it won’t appear in anyone’s collections, hence preventing my music from spreading (and potentially getting more sales from people who do want to pay for it). I’m sure a lot of students who chose to download my album for free, still had the same level of “passion” (they were usually the ones to email me or comment on my last.fm page).
I am nitpicking in what is essentially a great product and will most likely be one of the most underrated releases of 2013. I say this because well, I still don’t think anyone really knows “Bandcamp”, despite how solid it is. It’s definitely widely acknowledged in the musician and audiophile circles, but it’s outside of that where Bandcamp now needs to get some attention. This new network for music fans is a great platform for them, it’ll be interesting to see how many of them come along.
Front End Development newsletters
Addy Osmani compiled a list on Smashing Magazine with a tonne of talks about Front End Development. I’ve made it a small goal of mine to get through most of these. I started today by having a look at “How To Stay Up To Date On Web Stuff” by Chris Coyier.
Chris goes into detail not only on how / where to stay up to date, but also the process of choosing what technology to learn and use in new projects. The best thing I got out of the presentation were these five Front End Development weekly newsletters that I am now subscribed to:
Web Design Weekly:
http://web-design-weekly.com/
CSS Weekly:
http://css-weekly.com
JavaScript Weekly:
http://javascriptweekly.com
HTML5 Weekly:
http://html5weekly.com
RWD Weekly:
http://responsivedesignweekly.com
Front End Developers who delve into design should also check out Sidebar, sending out the best five design links everyday. Although I do find getting an email everyday is a bit exhausting, I would rather a weekly digest of their best links instead.
I will admit I didn’t immediately recognize the name Aaron Schwartz at the time of his passing, but after some research I realised I knew a lot about what he contributed to and instantly recognized what a prodigy he was (co-authored RSS at 14!).
Every post on the front page of Hacker News was about him, a feat I haven’t seen since Steve Jobs passed last year. Once particular post was this one on productivity that Aaron had published on his blog back in 2005. With Aaron’s resume, it’s clear he must have been able to be productive at some point.
I found this a really refreshing article on the topic. It’s a topic that gets written about quite often and that people will always be willing to read about, as lets be honest, we always feel we can be more productive.
The difference I found with Aaron’s take on the subject is he was more honest with how you have to prioritise your time and listen to your body. If you need to sleep, sleep. If you feel like eating, eat. I particularly like his tip for talking to inspiring people. I know that after any sort of communication with Tait Brown or Brenton Cleeland I’m almost immediately writing new ideas down.
Most of the time if I see a link to a “productivity” article that’s making rounds on the web, it’s usually some start-up CEO who has a strict routine consisting of waking up at 4:30am to go on his 10k run followed by eating a bowl of walnuts for breakfast (ok maybe slight exaggeration).
Aaron’s post from 2005 stands the test of time and bonds well with highly distracted, coffee fuelled and impatient Gen Y kids like myself. In summary: listen to your body, talk to inspiring people, make the best out of quality time and chill out during low quality time.
