Admittedly the biggest challenge is actual UI design work, because anything that requires I have an image editor where I can push individual pixels around is pretty much out, but if I’m going to be doing that, I want to be at my own desk anyway, where at least I can have the comforts of my own coffee and a decent graphics tablet.

I have switched over to an out and about model for my coding though. And it feels good.

So new set up for mobile working is as follows.

The iPad

My mobile workstation!

This is the corner-stone of my mobile working environment. It’s lightweight, easy to carry, syncs to Dropbox through my phone  (so external storage isn’t an issue) and it’s my working platform.

Admittedly, I did have to make it a bit user-friendly for working on the go. The biggest problem I faced with the iPad was the amount of space the keyboard would take up on the screen. However I didn’t want to get a net book or a Laptop, as I like having my single touch device. And when I’m not working on it, I don’t want a keyboard in the way of playing games or films, and I like being able to put it in portrait and read books.

So I had to make some adjustments and got myself one of these.

A Logitech bluetooth keyboard for the iPad

Small, neat, easy to use, and packs away into a small size. If i need to do anything more than type a couple of paragraphs, I now can do it in some comfort. Handy for when I want to get a lot done, but if I’m simply replying to a quick email, or Facebook post, or even GitHub issue, it stays in the bag!.

And an obligatory stylus!

Used for fast note taking with Penultimate and drawing in paper. I think every one should have one.

So that’s the technical kit out-of-the-way. Though I will briefly note that I also roll with a Samsung Galaxy S2, which I use as a mobile data hotspot for the iPad so it can have a net connection on the go.

The Software

Now this is where it all comes into its own, through a combination of software I have an amazing mobile work station.

There are 5 main apps I use day in and day out to get work done, but together they all work together seamlessly.

First up: Prompt

This is an SSH utility that is the workhorse of everything I do. By having a VPS that I can SSH into, I can do all my application development and logic server-side. Want to do something with Node? SSH to the server. Want to test some new Python modules? SSH to the server. Want to start a new Django app? SSH to the server.

Prompt on the iPad

This bad boy lets me get all of that done. And with SSH access, I can also use it to grab Git repo’s or make updates to git repo’s so I can write, save and commit new code, all through this bad boy.

Next: Managing my Git Repo’s with iHub

This nifty little utility lets you manage your GitHub account

From iHub, I can manage my Git Repo’s create new ones, track and respond to issues, as well as merge pull requests in group projects. This is a side tool more than anything else, just a handy way of managing my version control.

Client Mockups and Wireframing? I’ve got Proto

If I need to mock anything up, or play with layout ideas, I can’t go wrong with Adobe’s Proto. Released alongside their newest editions into the CS family  it’s already become an invaluable tool for quick layout ideas, and linked pages to show a websites funnel process and basic layout ideas. I will happily admit, that when I am at my desk I will do all this exclusively in Balsamiq Mockups, but on the go, Proto is my tool of choice.

Adobe’s Proto showing off a layout idea

As I already noted, with this little bad boy, I can also create linked pages so when you “click” on a link it shows you the next page in the chain. Very useful for giving a client a feel for how the website will behave, and respond.

Mobile HTML Warrior! Koder

Dropbox integration, FTP/SFTP capabilities, inbuilt snippets and Syntax highlighting? Yes please. Koder is a development app that lets me do code monkey work with relative ease on the go. Plus with all the integration features it has for various services, it means you can make changes to web code and redeploy easily enough.

More useful for making minor web layout changes or crafting HTML than anything else, but still incredibly useful. For application leg work, it’s back to Prompt, and Vi on the server.

working on some HTML in Koder

Last but certainly not least, my favorite text editor: Elements

I love writing in Markdown. I love it. it’s elegantly simple and it converts into clean semantic HTML with ease. Simply beautiful. And to match the elegance of Markdown, I have Elements. I can do all my writing and copy in Elements and have it export me all the HTML around it. No more having to fuss about typing tags and then copy, it all goes in as Markdown, comes out as semantic HTML.

Plus it Elements has the added advantage of being able to be used for any writing work you want to do. It’s just about my default text editor now. Though I do occasionally rely on Pages if I need to do anything fancy.

Just editing a document!

It also has a fantastic feature called the scratch pad, where you can jot little notes and ideas, and you can leave it hovering as you continue to type, making it useful as a reference tool while you are writing. Over all the app is simply beautiful and easy to use.

Honorable Mentions:

• Spotify for my Music.
• Evernote for saving everything ever
• Control Panel for remote management of servers running cPanel
• Penultimate for being the best note taking application ever
• Paper for being wonderful to doodle in

Conclusion

Over all I am insanely happy with my mobile working capabilities. I get to get out, and do more things instead of being attached to a desk, and as a bonus I can always kick back and watch a film if I find myself stuck while out. I love mobile working. I love that I can get out and work in the park with ease. It makes me a happier man. And now I can work while travelling in an easier fashion too.

Happy Days.

This is a bit of an elitist rant, or at least it will come across that way, but I believe that Design Frameworks damage the web and right now I’m looking at you Bootstrap.

Twitter’s Bootstrap Framework

First off, let me just set the record straight from word one. I love Twitter, I love their developers (all really clever people and damn good at their jobs) and I think Bootstrap is a wonderful tool. But like all tools it needs to be used correctly and unfortunately it is not being used correctly at all at the moment.

My main point of contention is that a framework should be as stripped down as possible, and cover the basics, such as grid layouts (both responsive or static) and basic typography as well as some basic element styles like Tables. And for what it is worth, Bootstrap does this bit brilliantly. It’s grid layout is beautiful and I enjoy using it. Their responsive functions for hiding some information on some devices are amazing, and it’s all beautifully documented and the classes all make semantic sense.

What I don’t like are the inclusion of more fancy elements like the pre-build top bar navigation and the default buttons, and all the extra fluff they added to the grid. Because while they work, and they work really well, they encourage way too much laziness in people looking to build something. They give your site no style of it’s own. Other designers can look at your site and see straight away that “Hey, they used Bootstrap”. And that is not what the tool is for. It’s supposed to be a base, something you can customize from and build up from, not just stick to the default styles that they provide.

Built with Bootstrap has a fantastic collection of sites, all developed using Bootstrap, and some of them are literally carbon copies of one another. And that is disappointing.

It’s for this reason that I really like Foundation by Zurb. It’s got a wonderful grid and some excellent elements, but it is billed from word one as being for Prototyping and Wireframing only. And it encourages it. In everything it does. It’s not fancy, they pre-styled elements aren’t pretty. They are designed to make their purpose clear and show people what the feature will do. Making them look good is all YOUR responsibility. Something that Bootstrap doesn’t do.

I respect the guys at Twitter that made Bootstrap. I’m glad they did. I just wish people would stop using it as an excuse not to style their own elements. Use it as a starting point, not as an end product.

iOS has always had what is described as a skeuomorphic interface. Skeuomorphism, for those of you that don’t know, is the effect of adding elements of design that serve no purpose in the object, but were essential in the original. In the context of UI design this essentially boils down to making apps and elements look like their real world counterparts.

iOS has always exemplified this, after all take a look at the native apps for iOS, calendars that have torn page corners like a real calendar, the notes application, attempting to look exactly like a notepad. Little things like this that breed familiarity with the users, meaning that even the least Tech savvy person in the world can pick them up and know exactly what they are for and how to use them pretty quickly.

An example of Skeuomorphic design, Pay attention the the leather feel and the stitching, and in the upper left, the torn paper effect.

As a result of this adoption of skeuomorphic style by Apple, the UI’s of most apps on i-devices conforms to this standard, which also affects web design standards as websites are made to look like the apps that use them, which drives the trend of other websites to follow suite, and now we have a whole slew of websites that follow skeuomorphic design trends.

But it isn’t the only major player in the design world at the moment. Style is a constantly evolving and rotating thing. Retro styles come back into fashion and new styles take hold. And lately a lot of the web has been obsessed with Typography and Swiss Modernism. A completely divergent split and this fascinates me.

Metro style interface for the iOS app Track8. Clean and simple, neat. a nice counterpoint to Skeuomorphic design

Of the two I certainly prefer Swiss Modernism, clean sharp interfaces, and Windows are doing their part to help this along with the ideas behind their new UI, Metro. Clean, typographically driven and certainly very, very modernist. A completely digital interface for a digital age. And in all honesty I’d have to say I prefer it. I think it looks cleaner and presents clearer. Don’t get me wrong, I think skeuomorphism can be a wonderful element for websites, to add a touch of human, a touch of real, but it needs to just be a touch. And the problem with adopting trends is that it all becomes bigger and overdone.

I design for both, but I do like that clean sharp modern interface.

Dave Out.

To start with I’ve looked into previous uptime monitoring solutions before and never really been happy with what they offer. For starters most of them are simply dumb end points designed to tell you whether your HTTP server is still responding to requests. A little bit useful, but very limited in what they can actually do.

I want more, a lot more. With all the technology available to us, I don’t want it to just tell me that my HTTPD server is down, I want services that can remote reboot server services and get things back and running again. Getting a text message while I am out and about, with no access to console to a server and reboot it is essentially pointless. Informative, but pointless.

And so Project HeartBeat was born, out of that self same frustration. A service designed to monitor VPS servers, and with a Command-Ninja extension running on the server, have the ability to detect issues and then attempt to automatically resolve them, if that’s what you want.

Objective

Project HeartBeat is being designed from the outset to do the following things:
1. Check server status and report on HTTPD availability (easily tested using cURL)
2. Detect errors and inform the user when HTTPD has gone down
3. If HeartBeat has no response from the target server for an extended length of time, attempt to reboot the Apache Service.

Now number 3 is only really applicable for VPS servers, (those people on a shared host, I’m afraid you are left out), but if you have your own VPS then this service would be able to talk to it and issue remote instructions with Command Ninja.

Additional
At the moment this is still in the early planning stages and the beginnings of re-development for using the tool in this fashion.

• Server stops responding to http requests.
• Attempt to connect via SSH
• Server is no longer responding to ssh requests.
• Assume the server has simply killed it’s network interface
• Attempt to connect via Remote Console
• Discover that you can’t even console in
• Call Linode customer support and get them to manual issue a system reboot

Made for a certainly entertaining Friday. I’m certainly more than grateful that it was only a development server and not a production one. But it got me thinking. When it all stops responding to remote requests what do you do?

Heart Beat

Heart Beat is an idea that I have shamelessly stolen from Cheshire Constabulary’s IT department. In their server rooms, there are several key production servers that talk to each other with a “heart beat” and if for any reason one of the machines dies, it’s slave takes over the running of the environment, in a graceful failover fashion.

Building on this idea, I started looking at a solution that you could implement from anywhere. Set up any set of machines in master/slave configurations and have the system push a DNS update if one of them fails, to switch the service over. It’s completely experimental at the moment, but for internal server environments it could be a god send. (The internet on the other hand not so much given the delay in DNS propogation and the fact that your “delays” could be caused by a simple network bottleneck somewhere).

So I started developing, and then thought, why stop there? After all, I have my Command-Ninja module that allows a server to issue command line instructions and return output (which I do mostly use for remote diagnostics), and expanded on the idea with the ability for the machine suffering the Heart Attack to write some log files, then attempt to commit a graceful shut-down and reboot.

Could be a nifty idea. Watch this space.

So today I happily introduce SlimNode. Making use of flat files to provide a fairly secure blogging platform that you can re-theme easily with Jade, and can push articles to using Git (Which means using SSH so very secure).

I’ll probably look at extending it sometime in the future, but for now it makes for a VERY easy way to get a site off the ground. I’m tempted to make a CMS based off the idea behind it, which makes for rapid iteration of content.

Enjoy!

PS. If you need help deploying it. I recommend using Heroku or AppFog, unless you own your own VPS. I’ll even provide some help setting you up if you want.

I’ve always been fairly interested in Web technologies, ever since an early age. I enjoy logic and structure and order, and this was brought up with me though early steps in programming for the Windows command line, and when I was introduced to the world of the internet at about the age of 8 or so, I was instantly curious as to how to how it all worked and how pages were made.

This immediately prompted me to poke around and learn. One of the best days of my life was when I discovered the view source button in Internet Explorer (So sure me, I was young and naive).

I quickly started building little HTML pages and discovered that I quite enjoyed it. And from there I started delving more and more into various programming technologies, especially those relating to web programming, which quickly brought me into the world of PHP websites, and then Data driven websites utilizing some kind of database back end.

I figured that I could probably make a career out of doing so and in every single job I have had, I have either done web work as a side line, or been able to find internal projects to attach myself to that I could use to stretch my design and development muscles and get some experience under my belt.

This introduced me to newer and more interesting languages like JavaScript, then Python and most recently Ruby for web. But the programming aspects of this intrigued me just as much, so I started soaking up almost every single Language I could get my hands on, leading me to learn C, C++, Java and others.

My enthusiasm for developing never dampened and I like picking apart other peoples systems and seeing if I can make them better. Solving problems can be a lot of fun.

So I decided to make a career out of it, and subsequently I have done some work as a freelancer while in other jobs, and I try to keep up with it and take on client work alongside my regular day job.

But over the next 2 years, I am going to make it my goal to see if I can actually make a real career out of it, when my current work contract ends, and go for it full time.

This blog will keep up with that goal as well as follow with tutorials for technologies that I find interesting as well as interesting bits of information that I find.

To any body else looking to do something like this, I suggest as a good starting point that you check out the wonderful website Freelance Switch, which is filled with advice for people looking to start out on this path, with a lot of good tips and advice. It makes for some good reading material, and to those of you already familiar with my twitter feed, you will occasionally see me post links to some of their material that I think people should give a good look over.

So where I am at now: I have my Portfolio and general freelancing work done here at Sivocha.com, but for most of the business stuff, I am starting new with ThreeHive, which will be my little Design and Development agency, and I look forward to the challenges.

First and Foremost of which I think will be the incorporation paperwork for the business. (Setting up as a limited is always a good idea)

Wish me the best of luck.

David