Jan 11 2010

Lorem for Twitter mock ups – 144 characters of doom

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad mini

– as generated from TextMate.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad min.

– slightly tweaked by me for a complete ending.

no comments   |  tags: ,

Jul 18 2009

RSS Feeds reduced to Sparks

Fever Website LogoOne of the most time consuming thing I do in my day is go through my RSS feeds and skim past every item. To try and make my life easier I recently purchased Feverº and absolutely love it! It lets me set Kindling for feeds I must read and Sparks for feeds that I kind of want to keep track of. Both these categories add to the Hot list. Basically Feverº works out how popular a news item is by the Kindling and Sparks items and how many links they have.

So rather than having everything in Kindling I’ve slowly been moving the high volume low value feeds to Sparks.

My hope is rather than an hour + per day I can limit RSS reading to 5 minutes yet still feel like I’m not missing something.

no comments   |  tags: ,

Jun 30 2009

Flex ActionScript Component Development Cheat Sheet

Recently at work I ran our developers through basic construction of building Flex ActionScript Components.

Feel free to download the attached Cheat Sheet for your own reference when building components.

Download Flex ActionScript Component Development Cheat Sheet

Building ActionScript Components

Aim: To make building custom ActionScript components the first option when developing in Flexlandia.

Naming
Don’t describe its appearance – eg. RedButton, RoundedBorderedWindow.
Do describe its function or UI element type – eg. ActionBarButton, InspectorWindow, NewElementFormPanel

Extending
Extend UIComponent or as high up the inheritance tree as possible. Loc8 is massive so we want to make sure each component is taking up as little memory as possible.
Avoid extending HBox or VBox! – custom layout is easy!!

Property Names
Keep in mind re-use for the data model:
  • use generic terms like dataProvider – not assetData, label – not workOrderLabel

Multiple Components
Don’t try and implement everything in the one component. Break it down further. Generalise!
The benefit is it makes it easier to extend and reuse in multiple situations.
It also allows it to become a style target for simple CSS styling.

MX Source Code
TextMate with the mx sdk source is your best friend.


ActionScript Component Cheat Sheet

Component Children
Child Components
private var _icon:SuperImage;

note: an improvement here would to have the icon type to be an interface ie. ILoadedImage

Create Children
Create child objects of the component.

overrider protected function createChildren():void
{
super.createChildren();

if(!_icon)
{
this._icon = new SuperImage();
this.addChild(this._icon);
}
}

Updated Display List – where you lay it all out
Draws the object and/or sizes and positions its children.

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updatedDisplayList(unscaledWidth, unscaledHeight);

this._icon.x = 0;
this._icon.y = 2;
this._icon.width = 16;
this._icon.height = 16;
}

Measure – helps the component know minimum sizes and measurements
Calculates the default size, and optionally the default minimum size, of the component.

override protected function measure():void
{
super.measure();

measuredWidth += 16;
}

Component Properties
Property Setup
private var _iconSource:String;
private var _iconSourceChanged:Boolean = false;

[Bindable(‘iconChanged’)]
public function set iconSource(source:String):void
{
if(this._iconSource == source) return;
this._iconSource = source;
this._iconSourceChanged = true;

this.invalidateProperties();
}

public function get iconSource():String
{
return this._iconSource;
}

Commit Properties
Processes the properties set on the component.

override protected function commitProperties():void
{
super.commitProperties();

if(this._iconSourceChanged)
{
this._icon.source = this._iconSource;
this._iconSourceChanged = false;
this.invalidateDisplayList();
}
}


Component Events
Meta Data –  defining lets FlexBuilder MXML auto-complete – happy compiler
[Event(name=‘iconClick’, type=’mx.events.MouseEvent’)]

Event Notes
  • Minimise internal event handlers – where possible override event handlers from parent component. eg. override protected function mouseClickHandler(event:MouseEvent):void

no comments   |  tags: , , | posted in Software

Jun 15 2009

Finally some art … Jenny’s Rose

JennysRoseWeb.jpg

no comments   |  tags:

Apr 7 2009

Progressive Enhancement Meets WordPress

When designing the first place I start is either with a pen/pencil and paper or in PhotoShop. I thought I’d mix it up and try my hand at Progressive Enhancement as I attempt to redesign this site. So the first will be ‘nude’ no styling … just hopefully some clean HTML to start with.

no comments   |  tags: , , | posted in Design

Mar 18 2009

Apple Breaks Dvorak in Carbon

What the crap is going on with Dvorak in Carbon apps like Flex Builder and Eclipse :’( very very sad.

It seems that when apps utilise Carbon in Mac OS X 10.5.6 the keyboard mapping reverts to QWERTY instead of dvorak. However, this seems to be only for some keys.

Command+S is still Save
Command+W still closes a window
Command+Q still quits

However, copy and paste are totally screwed.

no comments   |  tags: , | posted in Software, Technology, Usability

Feb 14 2009

Remove Flex Component Border Skins

Just so I remember…

To remove the border skin from a Flex 2 Button or other Flex Components use the following CSS:

skin: ClassReference("mx.skins.ProgrammaticSkin");

no comments   |  tags: , ,

Feb 9 2009

LittleSnapper Review

LittleSnapperIcon.pngLittleSnapper – a fantastic way to Snap, Organise, Edit and Share screenshots, designs and other images.

http://www.realmacsoftware.com/littlesnapper/

Snap – CapturingLittleSnapper Menu Bar Item
This all works great. There’s a fantastic Toolbar Menu item for mouse-driven snapping. Mac OS already has great capturing built in for capturing: Full Screen, Area and Window. LittleSnapper adds Web Snappshots. It will grab an entire web page even if it’s out of view.

No ‘New from Clipboard’

My biggest gripe with the “Snap” part of LittleSnapper is that there is no pasting an image in to the Library or (similar to Preview.app’s ability) New from Clipboard.

The only way to get images in to LittleSnapper is by either dragging them or taking a “snap” using their capture tools.

Organise

This is done quite well. Definitely could be better, but is relatively smooth. I’m loving anything these days with easy tagging ability. Unfortunately tags currently do not auto-complete to pre-existing tags.

It has all the usual ways of filing: Folders, Collections and Smart Folders.

Folders – can contain Folders, Collections and Smart Collections.
Collections – can only contain Snapshots.
Smart Collections – can only contain Snapshots based on the rules below.

Edit

This is one the best bits. The actual controls are quite clunky, however, the end product is fantastic. I love that you can draw outside the border of images. This is fantastic for when you’ve got a smaller screen shot that you still want to mark up with arrows, highlights, text etc. I sure hope better control is coming here.

Share

This is probably where I find the most problems (other than some UI things I’d love to see tweaked). Don’t get me wrong Realmac Software have done a fantastic job at in integrating LittleSnapper with their QuickSnapper website, Flickr and the ability to upload to FTP or SFTP.

Sharing Annoyances

My problem comes more from how I use LittleSnapper. I work with a software development company where I take screen shots for inspiration, records of current work and in particular letting the developers know how I want something to look.

LittleSnapper is fantastic for taking a screen and marking it up … but then all I want to do is email it or or save the file.

Now, you can Export the image, you can also drag an image out of the main Icon View, however the exported image does not include any visual mark-up that exceeds the border of the original image. So if you’ve got a smaller image and created a Text box and an arrow pointing to an element you loose it all except the bit that overlaps the existing image.

Furthermore, sharing by email means exporting the image to say the desktop and then dragging it to mail. Even though the Edit menu has Cut, Copy and Paste in the Icon view they do not work for sucking an image in to the Clipboard for pasting in documents or email.

Summary

Overall, as a Version 1 it’s fantastic. It’s instantly become an “Open at Login” item on my mac. Some things in the UI bug me (at some stage I hope to write about them) but overall it’s a great concept and quite well implemented. I was initially put off by the cost … but after trying it for 20mins I just had to have it.

Apologies for no images … weird stuff with the latest WebKit nightly build and WP. (trying ecto shortly)

no comments   |  tags: , | posted in Software, Usability

Dec 30 2008

The Top 500 Worst Passwords – Why I use 1Password

Here’s a great list of the top 500 worst (most commonly used) passwords.

The Top 500 Worst Passwords of All Time

1Password

1Password

It’s another great reason why I use 1Password.

One of it’s best features is the Password Generator.

1Password's in-built Password Generator

1Password's in-built Password Generator

For any site or service I sign up for I use the Password Generator to create something nice and random. 1Password then remembers it all for me. So I only remember my “1 Password” and 1Password remembers the rest.

I thoroughly recommend it. It’s integration in to all major browsers is fantastic.

no comments   |  tags: , , | posted in Technology, Uncategorized, Usability

Dec 17 2008

Bookmarks for December 9th through December 17th

These are my links for December 9th through December 17th:

no comments