“Good design is as little design as possible. Less, but better – because it concentrates on the essential aspects, and the products are not burdened with non-essentials.”

Dieter Rams on Design

Mobile Battlestation!

Posted 295 days ago ·  Tagged: , , , , , , , , , , , , , , · 0 Comments

I’ve started doing a lot more work on the go lately, away from my regular desk, and while it does present some challenges to consider, I’ve been having a lot of success with it.

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

An Apple 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.

Why I dislike frameworks that provide design elements

Posted 299 days ago ·  Tagged: , , , , , · 0 Comments
Twitter Bootstrap

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 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.

 

Skeuomorphism v Digital: A battle of style

Posted 304 days ago ·  Tagged: , , , , , , , , · 0 Comments

It’s amazing how major OS’ have this tendency to drive design patterns through the things that influence them, and the effect it has on their platforms, and nowhere is this more evident than in the design patterns of applications that are place on the iOS platform.

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.

Introducing Project HeartBeat

Posted 317 days ago ·  Tagged: , , , , · 0 Comments

So a while back after dealing with a few server errors and issues, I can up with HeartBeat, a small utility that essentially monitors a server’s heartbeat (think medical and you wouldn’t be half wrong) and I initially had the idea to expand on this to provide extra functionality such as immediate fail overs and various other bits and pieces. I may well still do this for an internal network tool, but for servers located remotely this is more of a challenge.

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.

HeartBeat & Command Ninja

Posted 334 days ago ·  Tagged: , , , , , , · 0 Comments

So just before the weekend, we suffered an issue. One of my test servers stopped responding. It happens from time to time and is usually nothing to worry about (I’d certainly worry if it were a production server though). Suffice to say. Events went down as follows.

  • 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.

ThreeHive incorporated!

Posted 338 days ago ·  Tagged: , , , · 0 Comments
As of the 9th may 2012 ThreeHive was officially listed as a limited company on the UK Companies House register. Good times all round. Now any new freelancing clients I get will be redirected to there instead.

Still got a lot of work to do though in the interim time before everything is fully set up. It’s been just about a month, but man I have had a lot to sort out. setting up company bank accounts, and sorting out various bits and pieces that go with. Still rocking Ronin as my default invoicing and project management application though.
So next major steps are to finish off working on the 3 hive website, and to make sure that it is all nice and neat and good looking, and I still need to get a bunch of business cards sorted out as well. But now at least we are mostly looking at more trivial tasks.
So there we go. I am proud to announce ThreeHive.

Three Hive Logo

I’ll be even more proud when I finish getting the website done (which should hopefully be inside this week)
Word.

A new kind of blogging

Posted 338 days ago ·  Tagged: , , , , · 0 Comments

Lately I’ve been doing a lot of development in the wonderful server side JavaScript language; NodeJS. And so far out of all the play that I’ve been doing, I’ve managed to create myself a micro-blogging platform that is fairly easy to deploy and lightweight as well, weighing in at only 380kb.

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.

 

Invoicing and Billing: An exercise in beauty

Posted 381 days ago ·  Tagged: , , , , · 0 Comments
There is nothing better than a good organized filing system. I’ve grown to appreciate that more over time, after my final frustration with trying to find files caused me to snap and re-organize my entire working directory and stick to a dedicated process over it.

So when searching for software to manage my company invoices, and expenses and act as a mini CRM at the same time, I was stunningly pleased when I found Roninapp which is absolutely EVERYTHING I could possibly want in some business level invoicing software. It is absolutely wonderful and I doubt I will find anything that will be better in my eyes; though Ballpark came a damn close second based on the fact that the 2 are very similar, albeit Ronin I find has better navigation, but Ballpark has a nice iOS app for invoicing on the go, made redundant by simply using my iPad as a POS.
The Logo for RoninApp

RoninApp!

Absolutely stunning and easily branded to your company, and in a move I like very much, built mostly on RoR using the wonderful markup language Liquid, which makes invoice customization a dream.
So today marks the day that I upgrade from their basic account, to their solo account (hello business expenses!) And I now love it even more than I used to.
To anybody, be you developer, designer, photographer, or writer, You can’t go much wrong using Ronin to manage your invoices and clients. It’s beautiful. Give it a try!

Freelancing: A Journey

Posted 385 days ago ·  Tagged: , , , , , , , , · 0 Comments

So this blog is going to be about my freelancing career and the hiccups and successes that I have had a long the way, so a good place to start would be a beginning.

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

Older Entries