Flogging English

Camouflage pattern generator

retsoced — Wed, 04 Nov 2009 13:50:10 +0000

I’ve been on a pretty good run the last several days as far as a creative streak at my day job. Working through several new designs for banners, product animations and wallpaper designs. One of these led to the idea of having a camouflage background to build on, but I couldn’t find a pattern I liked, and I didn’t really want to blow all my remaining istock credits on an extended license of a background I would use only once or twice. So using some code I had written for a screensaver, I built a random pattern generator that would create a unique camouflage pattern about 1500 x 1100 pixels.

This is not unlike the grid generator I built late last year, in that I have been trying to find ways to create interesting backgrounds to use as elements for designs. The thing that I like about the camo generator though is that you can easily substitute a unique shape and create a branded pattern pretty easily. Simply by altering a few lines of code, you can change the scale, and rotation of the base shape and viola! You have a unique pattern using your logo or trade marked icon… like… oh I don’t know…. say a Reddit Alien camo pattern. Cool huh?

Here’s the source file too if your interested.

Designing mobile websites for the iPhone

retsoced — Sat, 24 Oct 2009 14:32:27 +0000

Even before I finally had an iPhone magically bestowed upon me (thanks to the fam!), I had a HP iPaq mobile player – and have been fascinated with designing and building sites for the mobile web. I’ve been designing and developing websites for more than a decade now, and while I wouldn’t say it’s old hat just yet, I do get into a routine often enough that it gets to be “been there, done that”, and can get a little tedious.

Mobile browsers have their own set of problems, and if you thought you had it rough with IE, Opera, Firefox, and Safari, then you’ve got another think coming my friend. There are so many variables with mobile devices that it is a real challenge to get it right, and it would be damned near impossible to do it across all devices. That being said, if you have a solid understanding of standards oriented design, then you have an excellent start.

Before you start building, the first thing you should do is examine your site analytics to determine who is on your site, what content they are accessing, and with what mobile OS and browsers. If 98% of your site’s visitors are using Safari on the iPhone/iPod, then why spend a lot of time getting it to look perfect on another device or devices? I’m not saying ignoring those other devices, but they would not be the primary viewer, so the bulk of the time should be spent developing for the primary target. Analyzing the site’s statistics will also tell you what content to focus on for the mobile site. Since bandwidth, screen resolution and speed are important on mobile devices, you should trim the fat of your site, and not delivering everything but the kitchen sink; that’s what your regular site is built for.

Once you have determined what platform(s) you are developing for, then you can start in on the design and build. For the sake of argument, I am going to focus on the iPhone. Keeping in mind that the screen size of the iPhone is 320 x 480 (pixel size), work through the design and make choices based on those dimensions. Be sure to plan for large buttons too, I can’t tell you how much of a pain it is to hit some of the little text buttons on some sites, and even some iPhone apps. Take for instance this screen shot of the Facebook app, and the little text link you have to hit to view your post when someone comments on it from the update screen – that’s something you want to avoid. If you are in need of some inspiration check out Smashing Magazine, they have a truck-load of great information compiled. In specific I recommend these two articles; Mobile Web Design Trends for 2009 and Showcase of Designs Optimized for iPhone. Now is also the time to decide if you want to support both landscape and portrait modes in your layout.

Let’s assume you have your layout planned out now, and are ready to start coding.The first thing you should code and implement is a way to determine if your visitor is on a desktop or mobile device, and I have some code that works quite well. In a post from earlier this month, I showed off some code I have been working for mobile device detection in .net. Of course not everyone is a slave to Microsoft, and I really don’t use much of it outside of my day job, so having something for a PHP solution would be handy as well. I found some useful PHP and JavaScript code earlier this year as well.

Of course, there are also specific elements you need to add to the head of the page(s) to ensure that your site fits properly within the viewport of the iPhone, otherwise your site will scale by default in Safari, and not look or work as intended. The first meta tag viewport, does just that and ensure a proper fit, while the second simply includes an image for bookmarking.


iPhone site | hooray!

This is the bare minimum, mind you, and there is more that you can code in page if you want deal with orientation as well. Here’s another great post from Engage Interactive on building a website for the iPhone. The majority of the site should just be well written, valid code and you will be able to support the iPhone and beyond.

For you Wordpress folks out there, WPTouch. It’s a great plugin that transforms your blog into an iPhone application styled site. I’ve had it running on Flogging English for a few weeks now, and while there are some plugin incompatibilities, it handles that well and I haven’t had any issues with WPTouch not working.

Scars – what kind of stories do they tell?

retsoced — Sun, 11 Oct 2009 01:45:26 +0000

I was noticing this the other day, and I sort of starting thinking about all of the scars that I have, how I got them, and what the story is behind them. I have a lot of them, I don’t think it’s any kind of record, but I seem to be littered with them. I have 23 scars that are easily identifiable ranging from a slice on my finger from hedge shears, to Mt. St. Helens removing at least 1.5 layers of skin on my leg as I repeatedly crash in the pumice, to the monster scar that has taken up residence on my abdomen from my transplant. Only 5 of the scars are the result of being hospitalized, and only 8 of them required stitches.

If I were to rank them in order of the most fun, I would have to say the cheese grater marks on my leg gave me the most enjoyment of any of the scars. Riding up the side of Mt. St. Helens was a blast, an epic ride where I was completely dusted by the guys I was riding with. Riding up the side of a volcano, above the tree line in loose pumice was something I will always remember, almost as much as riding along a 2 foot wide goat trail (same trip) with a slip grade slope upwards, and a near shear rock face down. The least fun would be from my transplant. Although I have to admit they administered some damned fine narcotics during my stay at UPMC, the hallucinations and weird side effects of a bad combo of Morphine and Oxycoton alone are enough to make me not really ever want to go through that again. Oh yeah, and don’t forget the mind-numbing pain during the first few weeks.

I have a tie for the two stupidest scars too. One on my left hip, and the Frankenstein on my left wrist. Both bike related, more than decade apart – and both really dumb. I got the one on my hip shortly after getting my first racing bike in the 9th grade; a Centurion Iron Man. I was riding around (in Florida), got hot and decided to tie my helmet to my handlebars – and crashed. W00t! w00t! I busted my wrist while waiting for my buddy Craig to get his but over to my house in Oregon, so I built a ramp in front of the house, got on my Mtn. Bike, hit the ramp, busted the plywood ramp, went up on my front wheel pushing the wooden box along the road for a while. Then the road decided I pushed the box far enough along, grabbed it and over I went. I knew it was busted the very second it happened. It didn’t really hurt though. The part that hurt was after the doc put my hand in some freakin’ torture device and pulled down on my wrist and squeezed it all back together to put it in a temporary cast.

The part that I find most interesting about the bike crash is that in all the years I raced, both on the road and on the track, never once did I crash. I’ve gone bombing down the side of a mountain on my Mtn. Bike at 48 mph, jumping stumps and flying through brush so thick I couldn’t see the other side – never once got hurt badly. I blame Craig, if he had shown up earlier I wouldn’t have been trying to build ramps. Ha! Yeah, he probably just would have been there to witness it in reality…..

It’s interesting to look at the scars I have and try to remember how I got them all, and if there is a story behind them. Some I have no idea how they got there, others I will never forget; some I am grateful for. Maybe a bit morbid, but they’re all mine – so in a self-centered sort of way it was fun to think about.

Mobile device detection with .NET C#

retsoced — Sat, 03 Oct 2009 12:41:03 +0000

Back in June I wrote about supporting mobile devices with JavasScript and CSS, and at my day job we have been tracking a very significant growth pattern of mobile devices accessing our core domain, so it’s time to take some real action and work towards much better, more streamlined support of these platforms.

I’ve worked with a variety of tool sets recently to accomplish too, on twanonymously.com I integrated PHP mobile device detection to redirect to m.twanonymously.com for a mobile device. What I haven’t finished there yet though, is the design. It’s basically the same thing with some CSS alterations to maintain consistency. But that will come later. At my day job, we are a .NET shop, so I have to find a better solution, one robust enough to handle the 1.2 million daily pageviews we serve up.

The code I am working, started from code I found over here at Web Design Blog, and I have been modifying it to cover a few more devices, specifically ones that are in our top 10. iPod and iPhone are the top two, in that order, followed by T-Mobile Sidekick, and then Android, and after that…. the Sony PSP. Go figure on the PSP. So these are the devices in need of immediate support, and luckily they are all similar in screen dimensions, so no drastic changes for each platform need to be made.

What I’m still working on is trying to figure which devices actually identify themselves as a mobile device when you use IsMobileDevice. So far, iPod, iPhone, BlackBerry do not. My Windows Mobile does though, and I don’t know about the PSP or Android as I have neither. Here’s a link to a test page I have set up so you can see the output. If you feel like testing a device, feel free to post the results in the comments.

Here’s the code I have so far:


<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="utf-8" %>







Mobile Device detection





<;asp:Label ID="DeviceStats" runat="server" />

Anonymous social networking with twanonymously

retsoced — Wed, 23 Sep 2009 01:50:04 +0000

I’ve been playing around with social media for a while now, and I’ve been working on a couple of things that really didn’t amount to much when the idea of twanonymously was…. sort of presented to me. I say it that way by mere circumstance, when I came up with the plan to create a site allowing anyone to post whatever they want to twitter. It seemed like a natural extension of the opposing ideas which sites like Oversharers.com and Twaxed.com are working with. Obviously there are folks out there that like to let the world know that they wear their heart on their sleeve, so it would stand to reason that there are more folks that might be able to benefit from anonymity. So was twanonymously.com born.

It’s fair to say the site is really a beta, but that is pretty much the Web 2.0 SOP isn’t it? it took me a fair bit longer to build it out that what I was anticipating too. Besides the revisions of the design of the site, I ran into issues with the posts from the API not being featured in the search, so they weren’t showing up with the feed listing tools that I starting using. I wound up using a twitter class built by David Billingham, and it works great. It’s super easy to use, and I’m hoping to get back into the site soon and get some upgrades going too.

I’m pretty jazzed about getting the site up and running. There is a standard and a mobile version, so I hope to have everyone covered. being a designer by trade, I’m not completely happy with the design yet, and I really need to get a better logo going, but right now that’s a little out of the realm of what I have time to sit down and bang out. Soon though. Although, I will say, if anyone wants to design a logo for the site I would be happy to take submissions and of course credit would be given.

The other thing I thinking of building is an iPhone and Android app for the site. I have been dying to use Titanium Mobile ever since I learned about it at FITC Mobile the other week, and this would be a good, small project to jump into it with. And naturally, it would be a free app on both platforms. I know a couple of folks that have HTC phones, so if you read this and are interested in doing some beta testing on that platform let me know, and that may help get me going on those apps.

At any rate, time to get posting!

FITC Mobile 2009 | totally awesome in Toronto

retsoced — Thu, 17 Sep 2009 02:54:23 +0000

I just returned home yesterday from the first ever FITC Mobile up in Toronto, and if I was still of the drinking persuasion, I would raise a pint to Shawn and all of the other amazing FITC staff and volunteers who makes these events so bloody awesome! Every one of the events I have attended from them is amazing. Flash in the Can is always my favorite, but they are all top notch. The David Carson workshop a couple years ago was brilliant.

I always come back from these things energized and ready to take on the world again with new ideas and exposure to all sorts of tools, designs, people, and technology that I hadn’t heard of knew little about. FITC Mobile was no exception. The top 3 for me were sitting in with Dom Sagolla, Brady Gilchrist, and of course, Colin Moock. The only real down side is figuring out how to make all (hell, I’d settle with one or two) of the things swimming around in my cranium become some semblance of a reality.

The coolest thing I learned about was MegaPhone. So basically, it’s a Flash built gaming engine that allows players to call in using a mobile or standard phone and play games against multiple players from any location. They have some great things going on, have some cool games and more information on their site. I would love to get something like this going at work.

Being a mobile conference, there were a lot of sessions on iPhone dev and marketing, but they ran the gamut from Blackberry, to Windows Mobile. One things that I will be using on my next app will be Titanium Mobile from appcelerator. Titanium Mobile allows you to build native iPhone and Android apps using HTML and JavaScript, and it looks really cool. Just the other day, a friend of mine Ryan, sent me a link to an article about using .NET to build iPhone apps.

So now I want to be able to build simultaneously to iPhone and Android, so I will need an Android phone. I also have ideas for about 6 more iPhone apps, a couple of web sites, and some other things as well. Great. Last time I checked I’m just one dude who already has a full-time gig. I guess I’m going to have to prioritize a few things.

Now if only I can figure out how to squirrel away another extra 3 or 4 hours in the day, I’ll be all set to make millions…..

So what’s on your iPhone?

retsoced — Sun, 13 Sep 2009 00:35:54 +0000

I’ve been pretty much joined at the hip with my iPod since I bought my first one back in 2005, I think that’s when I got it. Now that I have an iPod Touch and an iPhone, I have entirely too many apps loaded onto those two devices. In fact, I have 113 apps installed on my iPhone. It’s actually kind of a shock now that I sit down and count them – holy crap! WTF?! That’s a lot. Granted I don’t use all of them an aweful lot, but the ones that top my list are:

Facebook
Evernote
Things
Gas Cubby
Fandango
What’s On?
DoodleJump
Fieldrunners
iFighter
FlightControl
FIB-U-LATOR
Toki Tori
Pocket Gods
Oregon Trail

They way I look at apps is kinda like Pokemon cards – gotta catch em all! Not all of them are awesome, some are down right stupid. The dumbest of the dumb so far has to be the iGlowStick. Next up after that is the Coke App, Spin the Coke. I mean, I like playing spin the bottle as much as the next guy, but dude? Really? There doesn’t need to be an app for that.

I was goignt o collect up all the icons for my apps and post them here, but I am way too lazy to track them all down. So what’s on your mobile device? How many do you have, and how many do you actually use?

Dunny Hunt 09 paves NYC with QR Codes

retsoced — Tue, 01 Sep 2009 10:42:42 +0000

Yesterday morning Kidrobot launched a digital scavenger hunt with Dunny Hunt 2009. The premise is super easy, follow the clues to find hidden promotional items and scan them. For every one you collect, you get a chance to win free stuff; the grand prize is a complete 2009 Dunny collection. The execution is a bit more complex, and is the best use of QR Codes that I have in the US to date.

Kidrobot and We Are Plus are executing the 5 day promotion using Facebook, twitter and scanning apps such as BeeTagg reader for the iPhone. Once you have registered with the Dunny Hunt website, your scans are tracked so you can see how you stack up against everyone else in the leaderboard. So far there are 26 pages of registrants on the board, with the leader having 18 of the possible 22 scanned, me being dead last at 146 with none scanned.

This great news for anyone interested in using QR Codes, but has been put off a bit by the lack of ubiquity. It’s a great idea, and can generate a lot of interest in Kidrobot and Dunny. For those who don’t don’t know what a Dunny is, check out the Kidrobot website – they’re pretty cool vinyl designer series toys, like the Nightmare in Jeremyville Dunny.

For more information, read the Dunny Hunt press release from We Are Plus.

It’s good to see companies and agencies in the US finally coming around to a technology that has been in Japan for years. I have been writing about QR codes for over a year now off and on, having seen some cool applications in Canada as well as Australia. I even have a couple Commando Nerd patches that link back to my site – one of which is attached to my laptop bag. The largest campaign in the states that I know of is what Ralph Lauren did last year with mailings, in-store posters and graphics, and magazine ads tying it all back to their mobile site.

In the release, the idea of expanding the promotion to multiple cities is broached – which could be really cool in some of the more densely packed areas. You could start to get participants from one area participating in multiple cities, and really create something cool, and interactive in a big way.

Create your own fractals with Ruby Fractal Library 1.2.0

retsoced — Thu, 27 Aug 2009 10:59:20 +0000

The newly updated version of the Ruby Fractal Library lets you get your fractal geek on while simultaneously getting your web geek on with Ruby. I haven’t had a chance to get into this yet, or even Ruby for that matter, but I have it added to the long list of things that I will be getting to if and when I win the lottery.

The most interesting part about tools like these is auto-generating things that can be classified as art, or used in the creation of art. Creating artwork by manipulating code; something which many people consider to be a form of art all unto itself; is an idea that I find completely intoxicating. Here are a few examples:

Jared Tarbell created Invader Fractal back in 2003 using ActionScript, and wisely made prints available (something which seems to have vanished). The patterns created here are very interesting and would make a nice edition to just about any cube wall….

Eric Natzke is another amazing artists who utilizes code to facilitate his creative process. Check out his latest work on flickr for an upcoming show in Toronto. Unfortunately I will be in the city about 3 weeks too early to see the opening.

Joshua Davis is another one too. His development, coding, and artistic ability is a trifecta of awesome. I have seen and followed his work since I first heard of him back in the day at a FlashForward conference.

Fractals artwork isn’t hard to find, nor is it hard to figure out why people find it fascinating. A simple Google search reveals a wealth of imagery and some spectacular examples. One of my favorites landing spots is Fractal World Gallery and naturally there’s good stuff on Deviant Art. Here’s a flash app to build and layer fractals as well, it totally aced Firefox a minute ago – so be warned, but it’s pretty cool.

Oops. I sort of went off on a tangent there. For more information on the Ruby Fractal Library, head over to CrunchLife and check Ryan’s post.

Great Googily Moogily! FIB-U-LATOR goes live!

retsoced — Wed, 19 Aug 2009 01:00:41 +0000

A picture is worth a thousand words, or maybe just 99 cents! As of just a few minutes ago, FIB-U-LATOR went live in the app store.

Thanks to everyone for help, encouragement, sarcasm and most of all…. excuses! DOn’t forget to sign up on the Facebook fans page too, it’s been a lot of fun (and work) to get here, and I’m really excited. If you couldn’t tell….

Check it out, buy it, and give awesome ratings!