Something might be wrong…

    Looking at the Amazon ratings of the PS4, there’s a whole lot of blue lights of death.

    It’ll be interesting to see how this pans out.


    Just say no to the 60 hour work week

    In the tech and design sectors there’s a lot of folks working long hours, like 70+ hours a week. There’s a certain badge-of-honor-martyr-complex-thing that comes along with it. But let’s set the record straight. Here’s what long hours really mean. - wearemammoth.com

    Go read the article linked above, but the TL;DR version is that long hours symbolize a poorly managed company that does not respect its employees.

    I had a phone interview with a company that prided itself on 60+ hour work weeks, and the CEO boasted over the phone, “We don’t believe in work-life separation, we believe in work life integration”. 

    I appreciated the honesty. It was clear that we weren’t compatible.

    Even after talking to an engineer interested in recruiting me for his team at Yahoo, I was surprised to hear that most employees work 45+ hour weeks. Its entirely more reasonable but that extra hour is an hour lost going to the gym, taking your dog for a walk, spending time with your significant other, playing with your child, watching a movie,reading book, playing playstation, playing an instrument…. quite simply, being who you are.  I’d gladly take a job where I make $60,000 work 8 hour days than $80,000 and work 45+ hour weeks. It doesn’t mean I’m not passionate about the work I do, and I do enjoy it but I do not derive my entire identity from my job.

    Often young employees make the mistake that long hours will be seen as dedication. Its not the case. If you need further proof, read “Fire the workaholics”. In fact, read Rework, which is should be read by every employee and every manager as the business manifesto that we all should aspire to.


    What shipping without a browser for Android 4.4 KitKat really means

    So Google is shipping Kitkat without a web browser…

    Android 4.4+ KitKat ships without browser app. OEMs have to license Chrome or build their own

    “According to Android developer and author Maximiliano Firtman, he just got official confirmation that KitKat “… doesn’t ship with any browser, just the WebView. The emulator has it but not real devices. It’s up to each vendor to create a browser app using the WebView (such as Samsung) or to get license to preinstall Chrome.” - unwiredview.com

    What the article doesn’t mention is google plans to auto-update the Chromium-powered WebView, by-passing manufactures. This means Google’s apps and app devs can continually run the latest and greatest even if a device is isolated to Android 4.4 hell years later.

    The big news for us web devs is the Chromium WebView finally supports remote debugging

    As a developer, you can count on most manufactures licensing the Google Web suite and your WebView apps will always have access to the latest and greatest.

    Its Google’s round-about way to regain some of the control lost on Android and to attack the problem of fragmentation. I’ve been a bigger fan of iOS development strictly from a front end developer’s point-of-view as iOS users are much more likely to update and the Nitro Javascript engine still   triumphs Google’s V8 in speed.

    That said, I’ll take an auto-updated webview over speed at this point.


    A mild change...

    Previously with this blog, its been a post a day format, but in reality 90% of my traffic is dedicated from roughly ten posts.  The takeaway message? Original / Quality posts count more than volume. Instead of trying to make a post day during the weekdays, I’m going to shift the focus to longer, more informative posts.

    My readership is still small but growing, to roughly 2200 pageviews a month (amusing considering I created a website at one point garnered, 120,000+ monthly unique visitors for an astounding 1,500,000 pageviews during the same stretch). 


    Cabel Sasser of Panic speech

    Cabel of Panic (the authors of Coda & Transmit). As expected, entertaining and funny. 


    Codekit Mini Review

    This review has been left up for posterity, Check out my Review of Codekit 2

    image

    You want this, you just don’t know it yet

    Codekit, slayer of dragons?

    Introduction

    Reviews are a funny thing when it comes to full production utilities for coding, they aren’t common and usually exist in the blogosphere. There’s plenty of reasons why, knowledge, scope-of-testing, time and so forth. So to contribute my part, I’ve written a review of Codekit, which I’ve been using as part of my work flow for two+ weeks.

    With the rapid development of LESS/SCSS and Front End Developers, User-Interface Designers/User-Interface Engineers, Web Designers, the like are suddenly have yet-another-technology-to-master. LESS and SASS for the uninitiated are pre-processing languages for CSS. Simply put, these are languages that extend the functionality of CSS with variables, mixins, imports, inheritance, operators and other goodies. I’m not here to profess all the features of these languages, but if you’re new to these, I suggest you take a look as for large projects, it can bring sanity. That said, both LESS and SASS need to be compiled to CSS before it can be interpreted by a browser. LESS has the ability to use a JS plugin to compile LESS into CSS in a browser which has alleviated but it isn’t a sure-fire fix. SASS requires compiling through a utility.

    Javascript can become even more heady, even the chore of minification can be a headache, let alone uglification and other space saving techniques. To help with some of the issues, JSHint and JSlint have worked wonders to find that one bad comma or random char. It becomes a struggle to do all these while developing.

    So without doing chores manually, we’ve seen the the evolution of utilities like Grunt.Js. Grunt.js uses Node.js (which starts to get out-of-scope) to create rules for combining multiple types of actions: preprocessor compiling, minification, JShint/JsLint and all the aforementioned. Grunt can even watch files and recompile when it detects a file change. That said, it requires setting up, which can be sometimes cumbersome and its inefficient. Compiling can take more than just mere seconds on large projects. While working on a telecom-mega-corp’s website, I found myself waiting roughly 20-30 seconds to to compile (On Core i7 2012 Retina MacBook Pro), to make matters worse, it’d routinely error out which then meant having to command line grunt every time I wanted to recompile to see my SCSS changes as CSS.

    You probably guessed it by now: The savior

    For those familiar with Grunt.js, it does most everything grunt.js does, and then some, for the rest of you, it does everything I just wrote about, but faster and without a command terminal but that isn’t even the best part. Codekit will reload your active tab in Google Chrome or Safari if it detects a change to an HTML/PHP/whatever in your active directory, much akin to LiveReload. That is isn’t even the best part. CSS/SASS changes are injected live, there’s no wait for a page reload, and the changes are animated.

    Also as a bonus, Codekit does lossless image optimization, much akin to ImageOptim. However its image optimization, while fast, doesn’t seem to be nearly as effective as ImageOptim. Worse while working on large banking website, I ran the image optimization. None of the assets appeared to have changed as Tower (my Git GUI) didn’t detect the changes. When I ran the Image Optim, one-by-one Tower detected the modified files.

    I’ll be interested to see if this is a reoccurring issue with the utility.

    image

    Codekit actively monitors multiple projects

    The GUI allows you to ignore files, and set destinations of files, install Compass or Bourbon. The GUI is straightforward, and doesn’t have a lot of depth, that said it doesn’t need it.  Most of the time when using Codekit, you’ll be running it in the background. In fact, most of the time, you won’t even be looking at Codekit. Occasionally on a bad compile, Codekit will leap to the front of the screen.

    image

    Codekit leaps to the front on bad complies with error messaging

    I’ve used it for several projects ranging from a Wordpress site with a theme styled with LESS, a groundwork SCSS built site with PHP to illustrate behavior of user interface, to currently, building out a style guide for a soon to be phonegap built Android app.  I’ve used it with both Coda and Sublime Text. 

    With a little finanggling, I’ve gotten to CodeKit to work with most projects. Codekit is quicker than grunt.js and more reliable, and best of all works with Grunt.js projects.

    I can’t say too much negative, I was able to get Codekit to work with a stubborn compass SCSS project, despite it compiling fine with grunt. I’ve hit the brick wall limit of watched files, which is an OS X limitation. Strange, unchecking watched projects doesn’t truly stop watching, meaning I have to manually remove the project from CodeKit.


    Why you should not use autocomplete

    This test URL will show you why quicker than I can explain it in words. Please try it and come back. If you’re using autocomplete to, for instance, sign up for an email newsletter, you might have just provided that website with your full address and/or (even worse) your credit card details too. It’s as simple as adding the fields to the form and hiding them from the user…

    - Joost de Valk, yoast.com

    Its a fun test, seriously, go to the test URL.

    The Autocomplete feature is a known risk but still often used, worse is the Chrome’s Insane Password Security Strategy. Basically, any time you have a browser store your information, especially Chrome, its a risk. 

    OS X’s keychain presents a risk but at least the user has to have access to the computer’s admin password to root around in the keychain stored passwords.


    Quote of the day - 'The PC is not dead, we just don’t need new ones'

    When was the last time you needed to buy a new PC? Two years ago? Three years ago? The last PC I built was in 2009. I had to upgrade because I pushed the previous one I built to the limit and that was in 2004. A 2009 desktop is old in computer years, but not so much in processing power. It maybe true that there are a zillion new processors out in the market and their benchmark show exponential improvement. But to me benchmarking is just a marketing gimmick. PC sales are plunging but they are the wrong indicator to determine the advancement of the technology. The reason we are not buying PCs anymore is because those we have are already pretty amazing. - Ibrahim Diallo, idiallo.com

    I have to agree, part of Apple locking down upgrades is insurance on future Mac sales. My 2008 Mac Pro is 5 years old, making it by far the longest I’ve owned a computer. Previously, my upgrade cycle was 2-3 years… then…. the Mac Pro happened. 

    There’s some significant advances that’s happened since my computer’s release: 802.11 ac, USB 3.0, Bluetooth 4.0, Thunderbolt, SSD’s wider adoption and the expected round of CPU updates for smaller/lower power/more powerful chipsets. Only one of these cannot be added to my Mac Pro… Thunderbolt.

    Still, while the current class of desktop i7s can best my Mac Pro, there aren’t many laptops playing in the same league as it. My AMD Radeon 6870 is only bested in the mobile sphere by the GeForce GTX 780m, and it still lacks the clock speeds of my graphics card.

    There are compelling reasons to upgrade around the corner, with high density displays soon to become to the norm, 4k video already widely adopted for videography, 36 bit color slowly marching into displays, the every increasing megapixel count on digital cameras, faster SSD with PCIe connections, richer internet experiences, a new generation of videogames focusing on the next generation consoles which will set a new standard, and that is bound to usher in march of upgrades as these will require faster CPUs/GPUs to fully realize. 

    Tablets are interesting but they’re limited by their capacity to present information and their form factors. This may not always be the case but for the foreseeable future if you’re in the game of not simply consuming media but participating in its creation / alteration, a Mac or PC will be your first choice.


    Responsive HTML E-mails?

    Responsive HTML E-mails?

     

    By single column, I mean that the primary flow of the content is downward rather than both downward and side-by-side. Side-by-side content usually requires reflowing to fit on a smaller screen. In contrast, a linear downward flow means content simply scales horizontally to fit the available space. Voila, one layout for any screen size! - blog.fogcreek.com

    Yup, the spoiler is to just width=“100%” your columns. Its simple and sensible, I like it. There’s no reason for the headache.


    Schizophrenic conclusions - the Appleinsider way

    Bloomberg Business’s magazine inspires more of AppleInsider’s brain-farting

    Apple Insider recently published a multi-page article after Bloomberg Business opted to use the infamous Apple beachball over the Windows hourglass. Its a sign of the times, right?

    The fact is Apple has had a very long history of product placement, often for free.

    Hollywood’s love affair with Apple is only an extension of the creative class’s large affinity for the Macintosh platform. In the early 90s, often product photography of monitors featured desktop images of Mac OS over Windows, a subtle jab from graphic designers, photoshopping their platform of choice onto ads. The significance of Bloomberg’s usage of the icongraphy with a beach ball isn’t indicative of a larger cultural shift to Apple, but the nature of computing itself. Once upon a time, blue screens of death and error type -11 haunted computer users. Today, freezes mostly come from single applications, from the oodles of advances in OSes, such as protected memory, process management the later.


    Check to see if your Adobe Credentials were leaked

    Check to see if your Adobe Credentials were leaked

    Adobe recently leaked millions of passwords and which has lead Ars Technica to speculate that it’s a massive aid to crackers.

    There’s a pretty nifty tool to quickly check to see if your password was leaked. A quick check showed that my old adobe account was compromised… fortunately it was through an old employer so its in their hands. 

    So again go to the URL below. Simply punch in your e-mail address in question and it’ll either return a yes or no.

    http://adobe.cynic.al/

    Also to make light of something that probably affected most of my colleges, I present the following meme:


    Together.js

    Together.js

    What is TogetherJS?

    We’d like to introduce TogetherJS, a real-time collaboration tool out of Mozilla Labs.

    TogetherJS is a service you add to an existing website to add real-time collaboration features. Using the tool two or more visitors on a website or web application can see each other’s mouse/cursor position, clicks, track each other’s browsing, edit forms together, watch videos together, and chat via audio and WebRTC.

    Serious JS wizardy here, it only takes about 50 lines of code to make a very simple shared drawing app. That said, I’m betting the server overhead is considerable.

    Mozilla Labs has cooked up interesting stuff before, but I think everyone is waiting on PDF.js


    Responsive Icons and the future

    First check out the demo.

    Its nifty, but not new, OS X (and Windows) has featured responsive icons for years now (try resizing your icons in OS X).  At higher resolutions folder icons are open and 3D, at the small sizes they’re lat and closed.  One might argue even the original Mac OS had “responsive” icons based on list views and icon views.

    Responsive icons were bound to happen on the web, this is simply an extreme version. There’s been some great discussions about responsive mobile images and different cropping based on screen size.  The treatment of responsive has extended in iOS 7 to text, with Textkit. Responsive is a philosophy has been extended to all aspects of design: photo, font, vector image, information hierarchy, structure and even data design.

    This demo seems extreme and such drastic icon changes would lead to potentially confusing user-experiences, simply by rotating a tablet and having all the icons change. Also, with the advent of high density displays, less is lost in the mix. I’m not against this, but the demo illustrates a cool-yet-impractical example. I’d love to see an icon set with an OS-like treatment, where the variations of the icons: A little more reservation. 

    Onward we go :)


    We Work Remotely - a job board for remote work

    Having gone through recently rigors of finding a new job and relocating, and now interviewing other developers for hire, I routinely post on résumés design, interview processes and the like. 

    It only sense that 37signals would create a jobs board for remote work, as they’re the poster child for a company that succeeds with this. My current work, we have a programmer who lives an Canada, while rest of us reside in Portland. Any given day, there’s a few people out-of-office, working remotely and we have contractors who work their entirety off-site.

    Its the new reality and its nice to see a site centered around it.

    https://weworkremotely.com/


    The movement away from modularity

    Early yesterday Motorola announced their ambitious Ara project - a modular phone with interchangable parts and features. In theory it sounds great - battery running low? Swap in a new one. Need a bigger camera for that trip you’re going on? Pop one in - no need for that big DSLR.

    Last week however, Apple announced something that was almost the complete opposite of that - their new line of Mac Pros. Beastly machines though they may be, they’re taken a nose dive away from modularity. Custom made parts means that you can’t just go down to your local Fry’s and pick up a new piece if something goes wrong. Non-standard form factors and connectors mean that if you’re looking to upgrade down the line, you’re probably going to be out of luck. This was especially shocking, as traditionally desktops have always held their ground in the move away from modularity that’s been seen in portables.

    Plenty of people are upset by this. Some people are arguing that it’s Apple’s way of getting people to upgrade their entire computer more frequently - a devious tactic to milk their customers for more money.

    I however see it as inevitability. -Which of these… …is the future of devices? jjcm.or

    Jack Miller makes the argument that to achieve the speed / power consumption and form factor, modularity must go. Its half truth at best. Form factor certainly always takes a hit for a modular design as the parts must be most of all, interchangable (which always requires some sort of mechansim to fasten, latch, rail or otherwise secure the part in place) will inevitably adversely affect form factor. Its a truth of industrial design. That said, Modularity doesn’t equate necessarily to more power consumption, and as of writing this, speed. Modularity is curse for devices that battle for milligrams.

    That said, the Mac Pro is not a device of milligrams or even grams. The Mac Pro is not a computer of mobility, instead its a work station, meant for high end work where performance and functionality win out on form factor. My Mac Pro from 2008 is still a viable computer in 2013 and will even in 2014. How could this be so?

    Modularity.

    Had my Mac Pro been locked to its factory specs when I bought it, it would have: 2 GB of RAM, an ATI Radeon 2600 XT, Firewire 400/800, USB 2.0 and a 500 GB Hard drive. It would have failed in 2010 when my hard drive in 2010, when the heads came to screaching halt, never to work again.

    Instead, my Mac Pro has an AMD Radeon 6870, ATI Radeon 2600 XT, 16 GB of RAM, 5 internal HDs, an upgraded DVD-RW drive, Firewire 400/800, USB 2.0 and USB 3.0.

    The obvious trade off is My Mac Pro 2008 is a 40+ pound computer. That is the true trade off.

    The Mac Pro is modular at its core

    The new Mac Pro is an exercise in modularity, you must provide your own HDs and chassis, provide your own expansion cards and chassis and add your own network gear.

    The irony is the in the Jobsian universe is this ideal computer does not have a single exposed cord, and now we’re left to a rats nest worth of external devices.


    A lightweight elegant Résumé using HTML+CSS (responsive design)

    I haven’t used this blog to promote my own work hardly at all but I figure this merits sharing.

    image

    Not everyone is a front end developer and even among us, few of us really enjoy laying out our resumés. Portfolios are exciting, and flashy. Résumés are not, nor should they be.  Nor should they be PDF only. What they should do above all else is cleanly communicate information quickly to busy people.

    During my job hunt, I was tired of attaching PDFs to e-mails and annoyed with some job application systems that asked for an optional Résumés, only to allow .doc format. 

    I do not own MS office and wonderfully formatted Resumés in Pages lose their luster after conversion. It was time to address this problem.

    I developed a simple HTML/CSS resumé, with a simple grid system, with a few minor CSS3 effects and the wonderful HTML5 download tag in the <a> tag. I can only testify that this is the resumé help landed me my current job as User Interface Engineer.

    I’ve never been a hiring manager but I’ve had to comb through résumés of applicants and I can tell you what I valued: Clean, clear and concise. While I am a design geek, at the point of a résumé, I’m in an information collecting phase, so the design should reflect that.

    Go crazy on portfolios, but be reserved on résumés. Your resume shouldn’t look like a generic word document but it should be relatively free of ornamentation. 

    You can see a live preview here.

    For the nerds out there, I’ve put this up on Github but you can download it as .zip here. Its tiny, 200k. Its also simple. HTML newcomers can simply replace out the text and more seasoned designers/developers can take the time to tweak it. I’ll also be working on a print.css file eventually for the world where things are still printed.

    Currently it has all of two templates based on experience. I plan to continue developing out this project and improving it to be ultr


    H264 now officially part of Mozilla

    Its no secret that FireFox was adding H264, but its now official with the announcement Cisco has acquired the patents of H264. Cisco is betting heavily on WebRTC, (a javascript powered API for real time web communication). 

    Cisco’s message to developers now is: “Don’t worry about those fees; we’ll foot the bill.” The company will compile a freely downloadable component for a variety of platforms and allow developers to add it to its own apps. Any fees for the use of the format will be directly paid by Cisco. - Gigaom, Mozilla will add H.264 to Firefox as Cisco makes eleventh-hour push for WebRTC’s future

    Does this mean the end of VP8? Gigaom points out Google this summer committed to VP8 for Google Hangouts.

    The codec wars aren’t over either, VP9 is in the works, the next webm, Mozilla is developing its own next gen codec that they’re claiming will leapfrog H265

    So if anything the codec wars continue. Instead of 3vix, DIVX, H264, VC-1, WebM, battle royal that waged from about 2005-current, or large battles of the early days of the internet  with many players, Sorenson, Real Video iterations Real Media, MPEG1, MPEG2, DV, DVC-PRO, WMV, we’re seeing the consolidation of power.

    With codecs increasingly tied to hardware optimization, this isn’t a trend that’s about to change. At least, it’ll eventually cut down on the ridiculous overhead of HTML5 video requiring Flash fallbacks for web video for FireFox.


    Also I’m quite literally the only person on Tumblr who writes about .h264, contributing increasingly to the nagging feeling that I am woefully missuing tumblr.


    LinkedIn - your creepy neighbor

    image

    Above: Justifying my art degree with 6 mintues in Photoshop

    Users are suing LinkedIn over e-mail harassing. I signed up for a LinkedIn account under pressure from a previous employer whom shall not be named. I’ve never liked it, its asked me to volunteer information I’ve never posted to any other social network and to some degree I have been duped into it.

    In the past few days, I’ve read good articles about deleting linked in accounts

     David Veldt wrote a great piece called, “LinkedIn, the creepy social network”, plus there’s also the linkedin Social Creeps

    I’m thinking I’ll be deleting my linkedin account soon. Dribbble and Github seem to be better recruiting grounds and I’m not exactly looking for a job at the moment.


    Snap.svg & Svg.JS - animating vector images with javascript

    I’m habitually linking nifty Javascript libraries / JQuery plugins that interest me but SVGJS and Snap.svg are both more than interesting. A few months ago I switched from using Photoshop for web designs to Bohemian Coding’s Sketch which moved me to SVG in a big way. 

    image

    I’ve seen other SVG javascript libraries like Dail.jsraphaeljs  but SVG.JS has enough documentation to get me started. SVG.JS also has a nice demo page illustrating the effects and animations.

    Snap also has a very impressive getting started and a beautiful website.

    image

    Source: SVGJS.com screenshot.


    lib/compass/configuration/data.rb - cannot load such file – susy Error (and fix!)

    image

    Warning: LoadError on line ["179"] of /Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.1/lib/compass/configuration/data.rb: cannot load such file -- susy

    You’re here because you’re probably seeing something that resembles the above. First off make sure your compass-core is 1.x.x or greater. Susy 2.x requires compass to be at least 1.x. (Need help?, see my previous post).

    Next up, make sure it your gemfile (usually located at your project’s root) has  gem 'susy' on its own line.

    Lastly examine your grunt file, if you’re using compass, you’ll only need to use the require: susy command (see more at the official docs). 

    Hopefully this helps in your gridding adventures.