30 Dec 2011

How I Designed The DJ Baby iPhone Interface

Here is a quick look at how I designed the DJ Baby iPhone app from sketch through to final UI.

Step 1: Sketch

Sketches are quick to do, you can change them easily and are cheap to create. Here is a doodle of how this simple UI could be laid out.

Step 2: Mockup

I can’t draw worth anything and my illustrator doesn’t have experience in designing user interfaces for apps so I made this mockup to show where I wanted all of the elements placed.

Step 3: Fully Illustrated

This is what came back from the illustrator and I was really happy with this. A few minor tweaks and we were ready to start developing the iOS app.

If your little one is a budding DJ, you can buy this app for 99c in the App Store.

Leave A Comment
08 Sep 2011

Business Lesson From A 6-Year-Old

I was telling my wife how I gave a free copy of my book to someone and this 6-year-old boy (my son, Anim) butts in and says how it’s not a business if you give things away for free.

I say “hold that thought” and we set up this little video lesson.

It’s such a basic principle of business, but people (especially in the web-app world) give away too much stuff for free. He’s a smart little dude. Makin’ his daddy proud :)

More Videos By Anim

» Anim Performs In The Park
» 5-Year-Old Designs an iPhone App
» Working From Home Again
» Giant Bubbles!
» My Little DJ
» The Mysterious Noise – 2 years old!

Apps Featuring Anim

» DJ Baby iPhone App – Voiceover
» ShareCam iPhone App – Appearance In Promo Video

Leave A Comment
08 Jun 2011

Don’t Pull An All-Nighter

Those four words are pretty much explanatory and good common sense as well. We understand how tempting it may be to, “just this once” stay up extremely late or even not go to bed at all, in order to finish off that one project as your deadline looms. If you have ever found yourself in that posi- tion, or think you may find yourself in that position, three words, friend: Don’t. Do. It.

First of all, your body is designed to sleep on a regular basis. This is when you are supposed to heal, restore, rest, and gain energy, health, and perspective. If you miss sleep, you are robbing your present — because your productivity is going to be shot as the night wears on, and be worse than shot by the next day — and your future, too, because sooner or later that accumulated sleep deficit is going to have to be addressed. Not only will your productivity take an immediate dive and your general mental and emotional state be less even-keeled, but your body’s ability to ward things off — your immune system — will be more vulner- able. You can end up going further backwards than forwards; you will pay, your family and friends will pay, your clients will pay and ultimately your business will feel the negative effects. It’s just not worth it, no matter how you look at it!

Secondly, this is just a bad space to be in — if you are at a point where you are working 24 hours a day, something is wrong and unbalanced in your life and it’s time to take a good hard look at what that may be. Are you taking on too much? Not making effective use of your time? Leaving too much until the last minute? Failing to delegate those things you are not strong at? Working with substandard tools or a disorganized workspace? Whatever is causing you to get to this point where you can’t even get to bed, analyze and isolate it and then figure out a solution.

People who are trying to work 24 hours a day in order to look good usually end up looking bad. People who burn out trying to impress others are never fooling anyone. Except themselves. You deserve to get a decent night’s sleep just like every other person in this world. So don’t fall into this trap — none of us are robots, everyone needs sleep. Even you.

Special Note For Parents: Dealing with teething babies or sick kids through the night can be tiring enough but on top of that add an evening up late working. That’s a recipe for disaster.

“People who say they sleep like a baby usually don’t have one.” —Leo J. Burke


The above post is an excerpt from my upcoming book “Energize Your Entrepreneurial Spirit” that I put together with my brother Scott. This book is scheduled for release in summer 2011 and contains 52 bite-sized essays to help entrepreneurs on their path to success

Interested in the book? Please join our e-mail list to be notified when we release the book.

Leave A Comment
24 Feb 2011

iPhone Note From My Son

He’s 5 and he wrote me this message:

It also looks like he drained the battery playing Angry Birds :)

Leave A Comment
10 Feb 2011

StarChart.me Launch!

I have finally decided to open up my star chart web-application to friends, family and any other parents out there looking for a mobile star chart app. We have been using this with our son for a couple years now and it has been a great tool to track progress against things he’s working towards. So I thought if it’s something we use that maybe it’s something other parents and their kids would like too.

It’s a pretty basic app but essentially you create a star chart with an end goal in mind. Some examples may be “playdate with a friend”, “bike ride with mom and dad”, “get to pick dinner for the whole family”, “fun day with mom or dad”, “stay up late!”,“trip to the toy store”. You can use it however you want of course but we have found that rewarding an activity was more effective than money or toys.

Keep family in the loop.

Subscribe a child’s family members via e-mail and StarChart will send them daily progress reports! Great for long-distance grandparents, aunties and uncles who don’t normally get a peek into the day-to-day of your child.

Signup now!

If you’d like to try it out for yourself, signup at StarChart.me!

Please let me know what you think and if you have any suggestions on how to improve StarChart or how you’re able to use it with your kids.

3 Comments
17 Dec 2010

From Sketch To iPhone Icon

Here is a behind-the-scenes look at how I created the ShareCam iPhone icon.

Paper Sketch

I believe that all good design starts with a sketch and since I haven’t designed many iPhone icons, I thought I’d try the same approach.

Vector Illustration

Here’s where the crude sketch is turned into more formal shapes. It’s supposed to be the fingers and thumb of somebody holding an iPhone :)

Color Fill

The shapes are starting to feel like something real. This is where I truly started to get excited for the end result.

Final Icon

Final treatment with some additional sprinkles. Here is where I spent most of the effort, this is probably the 3rd or 4th iteration. This icon looks and feels good when alongside its peers on the home screen.

See It In Action!

We’re launching the ShareCam app this holiday season. Be the first to know by subscribing to our launch notification.

Leave A Comment
14 Dec 2010

5-Year-Old Designs an iPhone App

My son Anim was talking about a new iPhone app so I grabbed some video to document his kindergartener thought process. He even followed through with UI sketches and paper prototyping! I’m so proud :) But seriously, it is interesting what kids choose to pay attention to.

The app that inspired this is Harry Potter Spells but he’s proposing a different take on the gameplay. He’s hoping somebody from Warner Bros. will see this and produce his game :)

Update: Some people have asked if I’ve done any apps with Anim yet and yes we have! I should have linked it in the original post but anyways, the app is called “DJ Baby”, we created it last year. It’s an iPhone app (iTunes Link) but we also have a free flash version here.

9 Comments
30 Oct 2010

Hacker News Parents Have An Average Of 1.7 "Little Startups"

I started working on my first startup, YikeSite, in 2006 when my son was 1 years old.

At the time there was pretty much nobody talking about running a start-up while nurturing a young family. Over the last couple of years some of the weblebrities in our industry are starting to have kids of their own (or at least are mentioning them more). People are increasingly talking about family at conferences, podcasts and blogs and it’s a really great thing for people like myself to finally see more of.

And that’s why my ears perked up when I came across a Hacker News post asking the HN community how a baby changes your life.

After sifting through several dozen comments I noticed that a lot of people were sharing how many kids they had and some even mentioned if they had boys or girls.

This totally intrigued me because it’s nice to see other entrepreneurs in the same boat as me with a lot of the same challenges and motivations. So as an experiment I crudely started tallying up the counts in the comments and created the infographic below.

It’s by no means definitive data (or a big enough sample size) but I just had to put something together to share with other Hacker News parents out there in hopes to encourage more people to share their experiences running startups/side-projects and managing family life. I have created a survey to send out to the HN community and see if I can get better data.

At 1 and 5, my two boys are the most original and promising “Little Startups” I’ll ever have :) I hope you get value from this infographic.

Hacker News Little Startups Infographic

View Large (156kb PNG) | Download PDF (295kb PDF)

Leave A Comment
09 Jun 2010

Working From Home Again

Two years have past since my last post on the topic, “Dads, Get An Office” where I explain the pros and cons of having a home office but eventually feeling the need to have a work space outside of the home.

In the last two years I went out and got an office, had a great time co-working with some great friends and got to hone my work ethic even more.

As of recently we moved and I’m back attempting the home office thing again. Our new house has a sweet setup for a home office that is away from the family common areas — which I think will be good for separation of home and work (I hope!). Only time will tell but we just got to work all the little bugs out first.

Oh and speaking of little bugs…

Day 1

The day started out great. Despite an office full of boxes I need to unpack, I’ve got a desk set up and I’m all set to be productive. Until 3pm rolls around and my 5-year-old decides it’s time for a snack in Daddy’s office. One thing leads to another and, well… watch the video.

I really do love it. Despite my earlier blog post I think I’m more equipped to handle the challenges. Even when I had an outside office, the distractions from my family were still there. They are welcome distractions though and I’m grateful that I get to spend more time each day with my family and just go with the flow.

1 Comment
02 Mar 2010

How I Choose Projects

My Dad once told me that at a job interview you should interview them just as much as they interview you. I think that’s a sound piece of advice and it’s something that I have been able to apply to my consulting business when looking at new projects.

My Criteria For Choosing Projects

When choosing projects at Animikii, I generally think about the following things when looking for new projects and client work. In no particular order:

Personal Connection

Answers The Question: Do I connect on a personal level to the goals of this project?

When a project directly impacts your personal life then you will take ownership over the success of it. Does this project relate to your personal interests or your community? Adding your passion to the mix ensures a certain amount of dedication that your client will pick up on and appreciate.

Professional Development

Answers The Question: Am I going to learn things that will help me in future projects?

There’s no sense doing anything unless you are going to get a good learning experience out of it. This may mean doing something that you’ve never done before or improving upon skills that you’ve been building as a strategic advantage.

The Client

Answers The Question: Do I like the person I will be working with?

This is what one of my mentors would call rule number one of working with people. In his words “don’t work with assholes” — or perhaps in my words “only work with people you like”.

Making A Difference

Answers The Question: Will completing this project make the world a better place or improve the life of people I care about?

I have always been lucky in this regard and have been able to take on work that not only impacts me personally and/or my community but also improves the lives of others.

Time

Answers The Question: Do I have enough time for this project?

And not only do I have enough time, but will it take time away from already existing projects, my business or most importantly: my family!

Money

Answers The Question: Can I take this project on and pay my bills next month?

I’m running a business and I need to include money as an important deciding factor for choosing work. I can’t forget that I am in fact running a business here. At the most basic level, a business means ensuring that at the end of the day more money came in the door than went out. There’s no shame in doing great work, working with great people, making the world better place AND getting paid while doing it.

High Scoring Projects Win!

In taking into account all of these principles when evaluating whether or not a project is worthwhile, if a project scores well in each category then it’s going to be very hard for me to say no.

How Do You Choose Projects?

I should note that this whole blog post was inspired from several discussions I’ve had with my good friend Jo Hund at ClearCove on this very topic. Luckily we have a lot of the same criteria which makes it easy for us to work together on so many projects but I’m always curious to know how other consultants choose their clients and projects. Please post your thoughts in the comments below.

Leave A Comment
17 Sep 2009

StorySomething Demo'd at TechCrunch50

I’m pleased to announce that StorySomething had the honour of being demo’d at the TechCrunch50.

My company was the lead development firm for StorySomething and we’re very proud that this project has been acknowledged by TechCrunch.

“Founded in 2009, StorySomething is a mobile and web platform for personalized and customized children’s stories. StorySomething provides busy, time-starved parents with a powerful, meaningful and fun way to connect with their children through stories and storytelling.”

Leave A Comment
20 Aug 2009

YikeSite Graphic Facilitation

Here is a timelapse video of a graphic facilitation session I did with Susan Low from pictureyourmeeting.com. We talked about the YikeSite Reseller Program and the upcoming revamp of the messaging/positioning for the YikeSite marketing site.

Leave A Comment
13 Aug 2009

Design Timelapse for Morinville.ca

I recorded the entire design session for the Morinville.ca website redesign. Morinville is a town near Edmonton, AB and they hired us to redevelop their website look & feel.

We implemented their design using the YikeSite content management system that my company built.

To do this, I used Gawker and set the screencapture to every 30 seconds. This design was done in 7 different sittings over the span of 17 days taking about 8 hours of sitting time.

You can check it out hosted on YikeSite over at Morinville.ca.

Leave A Comment
07 Aug 2009

Thunderbird Sculpture

Thunderbird Soapstone Sculpture

I’ve been into rock carving for years but recently I’ve picked it back up again. It’s a good creative outlet that is physical and provides a good venue to get some thinking done.

Leave A Comment
22 Jul 2009

The Jeffio Progeny

Anim and Everin

Today we announce the birth of the latest addition to our family, Everin! Pictured here being held by his big brother, Anim! Aren’t they cute? Kids are awesome.

1 Comment
21 Jun 2009

Role Model Award

Download NARMP PosterI am very excited to announce that I have received a National Aboriginal Role Model award from the National Aboriginal Health Organization.

I am looking forward to visiting communities across Canada throughout 2009/10 with the role model program where I hope to inspire youth to get into business & technology.

About The Role Model Program

“Each year, 12 Aboriginal role models are nominated by their peers. They are selected for their achievements, leadership, and innovation. Throughout the year, the role models will attend celebrations, school functions, workshops, and conferences to share their stories with other Aboriginal youth.”

Video From The Awards Night

Leave A Comment
31 May 2009

The Animikii Logo: From Beads To Bezier Curves

Animikii Logo

This is the story about how the Animikii logo came to be. Animikii is a web development firm I founded in 2003 and the logo holds a special meaning for me. And now, 6 years later, I’d like to share this with you.

Animikii is an Ojibway word which means Thunderbird and here is the process I went through to discover the logo.

Beaded Inspiration

Beaded Bracelet

My brothers and I were raised in the Aboriginal community and we were exposed to all different cultural aspects including Hoop Dancing, Pow-wows, Ceremonies & Beadwork.

Years after leaving home I was presented with a box of some old crafts from our childhood and when I saw this design I remembered sitting at the loom beading patterns like this one. If you look closely you can see four birds and two pipes.

Pen & Ink

Pen and Ink Sketch

The beaded wristband inspired this art piece that includes the four birds and two pipes however I added a few elements including two braids of Sweetgrass and a Medicine Wheel at the center.

This design was meant to go on my drum so I wanted a circular composition. While I used the horizontal beaded design as inspiration, I integrated the four directions which would would also work better in a circular canvas.

The four directions are an integral part of Native culture with each direction having a specific meaning.

Transfer To Drum

Beads and Hand Drum

I transferred the pen & ink design with tracing paper to the drum with pencil which left a light gray outline.

Once the design was outlined on the drum I used acrylic paints to complete the design based off of the original beaded colors.

And here you can compare the beaded wristband and drum design. I am quite happy with how this turned out.

From Beads To Bezier Curves

Trace Vector In Flash

When it came time to name my company I knew that this drum design would definitely be apart of the imagery I would use but the entire piece on its own would be too detailed and not very versatile.

Instead of using the entire piece I scanned in the top right bird and traced it using Macromedia Flash and bezier curves. The result was a logo in vector format.

Final Logo

Animikii Logo

Here is the final version of the logo complete with final touches and final type treatment. I picked a typeface by Ray Larabie (Canadian) whose fonts are simply amazing.

When Inspiration Strikes

I see this as an experience that has been a catalyst for inspiration many years later. I wonder what things are going on now that will come to fruition in my future.

I don’t know, what about you?

1 Comment
19 Mar 2009

What Is Your Gift?

GiftsWriting down and recognizing your gifts is just as important as writing down your goals. Goals can change over time and so can your gifts but what successful individuals have in common is that they focus on their gifts and not their faults. They focus on their assets, but not their deficits.

Successful companies and communities become so by connecting individual gifts that weren’t connected before.

Recently I’ve been asking people about their gifts have been humbled by some of the responses:

  • “I’m a good listener.”
  • “I’m a good singer.”
  • “I’m good at dealing with different types of people.”
  • “I’m a good public speaker.”
  • “I’m good at baking.”
  • “I’m good at selling things.”
  • “I’m good at sports.”
  • “I’m good at working with youth.”

How many people would I have to ask before hearing the same gift twice?

My Gifts

The first one is a new one I just discovered about myself and the second one I’ve survived off of for quite some time.

  • I like to connect people’s gifts together.
  • I’m good at figuring stuff out if I don’t know it.

I’m going to try harder to focus on my gifts and not my faults.

What Are Your Gifts?

If you are inspired, please share your gifts with me by adding a comment. I really really want to know! If you’re feeling modest just ask your friends and family what you’re good at and go from there.

13 Comments
20 Jan 2009

The Wow Factor: A Good Example

Where I’ve Travelled In 2008

Jeff's Dopplr Travel 2008

This morning when I got into work I was surprised to get an email from Dopplr with a link to download a fancy pants PDF summarizing all of my travels in 2008.

If you’re curious to see what I got up to in 2008, download my dopplr travel pdf. And here is a link to my public dopplr profile.

Hooked In

I’m not going to gush on about Dopplr, truthfully I was only half-heartedly adding some (and definitely not all) of my dates to Dopplr this year. I don’t have many friends using it so the social benefits for me aren’t apparent (hint: add me).

The point is that they’ve now done a good job hooking me in to continue to use dopplr AND I’m telling you about it. So, job well done to Dopplr!

Leave A Comment
10 Oct 2008

Telus & Bell Move to 4G GSM Networks. iPhone Inevitable.

Telus & Bell 4G Network & iPhoneIn Canada, we have a few mobile phone companies and only one of them uses GSM technology. For us iPhone lovers, our only choice was to go with Rogers.

This morning, news of a joint effort by Bell and Telus was announced and we learned that they will be working to offer 4G GSM technologies as early as 2010.

A shared network will mean that they can extend each other’s national coverage and compete heavily with Rogers. For the tech-savvy rural business travellers that I know, all hopes have been lost to use an iPhone since Rogers’ GSM network is not available in all areas.

Competition is a good thing and we seriously need this from mobile providers in Canada. I think this is a great move for mobile in Canada and is very exciting for me as a web developer to know that we can build some great things on these faster networks (and reach more people).

6 Comments
10 Oct 2008

How To Get Traffic From TechCrunch

Traffic To Apricado From TechCrunchThere’s a simple way to get traffic from the popular websites out there:

Leave a comment.

At one point I was looking at my statistics across all of my various projects and got a little excited when I started seeing web traffic from the likes of TechCrunch, 37Signals and Gary Vaynerchuk.

Most of the time when I leave a comment on somebody’s blog, I walk away and forget about it. But then I started noticing how this little act translated into a bit of attention on me and my business. Cool, right?

Here are some more example screens from my Google Analytics dashboard for referring traffic. It’s not a huge thrust of traffic but everybody matters and who knows, they might just join your community.

Traffic From 37Signals and Gary Vaynerchuk

Don’t Troll, Be Nice & Add Value

Don’t comment for the sake of commenting though. Add value to the discussion and if you can relate it to something you’re doing or something you’ve learned then all the better. Most comment forms provide a field to put in your URL. If the comment you’re leaving relates to a blog post you’ve already written then use that as your link.

Don’t Blow Smoke

Every community has a goody two-shoes and the longer you stay involved the more you see the regular commenters. Sure, be a regular commenter but don’t just be the person who is blowing smoke and excessive praise – add value.

So…. are you going to comment on this post?

4 Comments
05 Sep 2008

How To Recognize "Found Time"

Life Clock - Antoine de Galbert“How can I find time to…?”
“If I could just find some time to…?”
“Could you find time to…?”

Expressions like these are commonplace in today’s busy world. The frustrating part is not the actual “doing” of the thing you’re supposed to be finding time for, it’s the actual act of… finding the time!

I’ve been playing with a little life hack that I like to call: Recognizing and Maximizing “Found Time” (or RAMFT™).

So what is “Found Time”?

Found Time™ can be recognized in the moments where we realize that we’ve just saved a bunch of time.

Examples where small amounts of time can be found:

  1. You’re standing in line at the grocery store and the customer in front of you pulls out a huge wallet of pennies. Another till magically opens up and you’re spared at least 5 minutes of counting and recounting change.
  2. You’re on a conference call and it gets cut short by 20 minutes because the client had a bad tuna fish sandwich and needed to go.
  3. You’re in stop-and-go traffic and at the last second you see a shortcut which saves you at least 10 minutes.

Total Found Time: 35 minutes
(Go clean the bathroom!)

Examples where larger amounts of time can be found:

  1. You’re given an hour to research something on the interwebs and your mate taps you on the shoulder to give you the exact answer you were looking for.
  2. Kid goes to bed a couple of hours early
    (Hey, I wrote this blog post didn’t I?).
  3. You’ve writing a contract and then discover that you can reuse a previous contract and change the names around. Possible savings of up to 6 hours!

Total Found Time: 9 Hours
(Add a new feature to your web-app!)

Maybe not the best examples, but you get the idea (I hope?).

Templates, systems and other productivity tricks can help maximize the opportunities for Found Time™.

What works for you?

2 Comments
30 Aug 2008

YikeSite: A Year in Pictures

We put together a quick video to commemorate YikeSite’s first year. Have a look!

And the official entry in the YikeSite blog.

1 Comment
01 Aug 2008

AbeBooks + Amazon + Victoria

AbeBooks and AmazonCongrats to our friends at AbeBooks! Getting acquired by Amazon ups the ante for start-ups in Victoria and shines the spotlight (at least for a little bit) on where I call home, Vancouver Island. The tech scene in the last couple of years here has seen quite a few new startups and while some have moved away across the puddle, AbeBooks is staying in Victoria. A major win for Victoria and the startup scene here.

Looking to start a company in Victoria? Read ViaTec’s article, Why Vancouver Island.

Leave A Comment
15 Jul 2008

I totally got a 3G bPhone!

3G iPhone? Who needs it. I just picked me up a sweet 3G bPhone!

I encourage you to post your own videos of YOUR 3G bPhone!

4 Comments
18 Jun 2008

Sketches, Wireframes & CSS

Jeffio Sketchbook

It seems that I keep refining my interface design process for each new project that I work on.

In this article I’d like to share with you my process of designing a user interface from sketch through to the implemented design for Apricado Music.

Apricado is a service for independent musicians to sell their music online as a digital download.

Step 1 – Start with a sketch.

Reasons to start with a sketch:

  • A sketchbook is a little more portable than a macbook and doesn’t run out of batteries.
  • It’s perfect for getting ideas down, quickly.
  • You can do 10 versions on paper, scrap (recycle) 9 of them and not feel that you just waisted a bunch of time.

Step 2 – Wireframes & Copywriting

By “wireframes”, I mean using a tool such as OmniGraffle or Visio (but really, go with OmniGraffle) to be able to rapidly set up chunks of information on the screen. The idea is to not worry about design details too much but to worry more about the flow of the screen. Position on the screen is important, aesthetics are not. Words and copywriting are crucial for me at this point but some may argue that even this is too much detail.

The process of moving ideas from sketch into wireframes gets my head into a different space. I love this phase because you start to get a glimpse of where the interface is going by using words and layout together to define the user experience.

Step 3 – Design Mockup

When you get into “design mode”, it’s nice to not have to worry about business logic or mocking up a design with Lorem ipsum text because all of that thinking has been done by the wireframing step. Now is the time to think about branding, color, gradients and rounded corners :)

Some feel that you should skip directly to HTML/CSS and sometimes you need to do that but I still love me a good Photoshop session from time to time. As long as you know what can and can’t be done in code and your inner designer can live with the web version not looking exactly like the mock-up version, you’ll do just great.

Step 4 – Ta-da!

It’s simple. Take your design, slice it up and glue it back together in HTML and CSS.

It’s really hard to mockup web-based text so this is where you get to bust out your sweet CSS skills on the text formatting front.

In each phase there is always room for improvement and this step is no exception. In the designs below you’ll notice certain last minute iterations that made all the difference.

The Apricado Signup Form

Sketch

Signup Sketch

Last year, I attended the Future of Web Apps in London and I spent a good few hours on my flight from Vancouver sketching out a user interface for a new project that would be later called “Apricado Music”. I had been thinking about this app for quite some time and now it was time to put pen to paper.

I really wanted to make setting up a store as easy as possible so that more indie musicians can start selling their music with little effort. I knew that this would be one of the biggest challenges so I started here.

The goal of the site is to get a musician’s music into a store so I decided to make this a priority in the signup process itself. After the song is uploaded – boom – it’s in the store and for sale. But what about all of the song information such as the song name and artist name? That would surely need to be included in the form. I started to wonder what is the least amount of information we needed to sign up a use.

Wireframe

As I mentioned before, I like to write all of the copy in my wireframes. This phase is all about information flow with little emphasis on design so this is the best time to think about words.

I also got thinking about how we can remove barriers for an artist to sign up. We know that iTunes and other music software use metadata to store things like artist name, album and song name so why not just pull that information out of an uploaded song file and make our best guess at pre-configuring their store? This brings the signup form to two fields: an email address and a file picker.

Signup Wireframe

Design Mockup

I handed a friend of mine the wireframe and asked him to get is creative on. This enabled him to be free of making business decisions while also trying to make it look good. Andy kicked it up about 20 notches and presented the following photoshop mockup. I love this step because this is when it starts to look like a real web-app.

Signup Mockup

You’ll also notice that along the way we dropped the “Jam” and just went with “Apricado”.

In HTML and CSS

With each step provides an opportunity to iterate and improve on the design. Can you compare this to the mockup and spot the differences?

Signup Screenshot

Artist’s Store

The other key piece of this is the checkout process. We really want to minimize barriers for people to be able to support the indie artists they love. I didn’t want to have the fan sign up for an account or go through a lengthly checkout process. By using smart user interface design with some Ajax tricks, we could keep the entire checkout process to one or two pages maximum.

Sketch

This is the first attempt at the public facing store that an artist would have their songs up for sale on – a single page shopping cart with credit card form. Press the submit button and see a page where you can download your music.

Store Sketch

Wireframe

Store Shopping Cart Wireframe

Store Download Wireframe

In HTML & CSS

We could make some inferences on branding from the marketing and signup pages so we skipped the mockup step and moved directly to HTML.

Store Shopping Cart in HTML

Store Download in HTML

Store Administration

Wireframe

Store Administration Wireframe

Mockup

Store Administration Mockup

In HTML & CSS

Store Administration in HTML

There’s Always Something

I’m interested in the process of making things better and the journey for Apricado is just beginning. It will be interesting to look back at these images in the coming years to see where Apricado got its start.

In addition to future design iterations there will also be plenty of business decisions that might make some of these early designs moot and that is totally ok. We’ll take it step by step and respond as appropriate as required to keep it looking and working great.

Thanks for following along.

11 Comments
16 Jun 2008

I totally built a Micro-App!

I’m really loving the whole notion around Micro-Apps. There’s something about the idea of sitting down for a short period of time and just launching something that really gets me excited.

Some define characteristics of a Micro-App as the following:

  • Built in one (or two) sittings.
  • Very narrow focus. Few features. Solves one or two things.
  • Just get something launched.

For me, it gives me a renewed hope that it is possible to get things launched. It’s just a great feeling and inspires the other larger projects I am working on.

There are certainly no shortage of people building micro-apps. A couple of friends here in Victoria have created some very successful apps and seem to always be pushing out things on a regular basis. Very inspiring.

I also went to Eric Kastner’s talk about Micro-Apps at RailsConf recently and got inspired to build my own.

Are you being heard? Or ovrheard?

EarThis weekend I put together a little app that scans the Twitter public timeline for anything pre-pended with abbreviation “OH:” which of course is short for “Overheard”. People use this when they quote something funny that another person has said and is especially funny when taken out of context.

The app took me a few hours to build on the weekend and is available at Ovrheard.us. It doesn’t look pretty (yet) but it is launched and collecting people’s funny quotes.

It is based on an application I built about 9 years ago that displays a random quote that somebody has entered. We’ve got over 100,000 entries over there which is pretty neat since it was built in a few hours as well and just kept the domain name active all these years. The plan is to re-do this app as well.

4 Comments
09 Jun 2008

A Video Welcome To Jeffio Blog

Thought I’d introduce you to my 3-year-old son Anim. He is the funniest kid I know.

Maybe I’ll try dropping the odd video here and there to see if we can make it work. This one was sure fun to make. Enjoy.

1 Comment
06 Jun 2008

Apricado Music Sneak Preview

Apricado is a great way for independent artists to sell their music online. In this video I’ll show you how easy it is to set up an Apricado store if you’re an indie musician. This is the sneak preview. We will be launching in summer ’08.

Like it? Digg it!

1 Comment
03 Jun 2008

Conference Dating 101

Comfort Zone Every conference I attend I have a real hard time going outside of my personal comfort zone and actively trying to meet people. As an entrepreneur I’ve learned time and time again that the broader your network is the better it can be for business and personal growth.

I have just returned from RailsConf ’08 and for at least half of the conference I didn’t talk to anyone. Most of the people I did meet I met by accident and by the end of the conference I started to notice a pattern of how I ended up in a conversation with somebody.

Geek dating

The first thing to consider is that everybody is basically in the same boat as yourself: scared shitless to start a conversation with a random person. This is “geek dating” at its finest.

Don’t sit with friends

This one is really hard because if you travel to a conference with friends, the easier choice is to just sit together. If you just can’t be away from each other then choose places to sit where there are already other people sitting and start a conversation.

Wear a silly shirt

I noticed that most of the people I started talking to was because they had a funny shirt or a shirt representing their company. It’s an easy in to get a conversation started. If it worked for them, maybe it’ll work for me at the next conference.

Everybody is important

You never know who you’re talking to so be nice, stay interested and ask lots of questions. Not only that but this person could be anywhere in the world but they are here and spending time to talk to you. Give them the attention they deserve.

Say hi to your heroes

One reason I love conferences is that it gives us a chance to see, in person, the industry experts and leaders in our community. Most of the micro-celebrities in your industry will be happy to give advice. So just ask and you’ll be surprised.

Seize the day and make it count

You’ve spent the money to get there so you might as well make it count. Get up at an open mic and share your experiences. If you’d always dreamed about being interviewed on a popular blog or podcast, why not just ask?. This is what led to me getting interviewed on The Web 2.0 Show and the Ruby on Rails Podcast.

How do you do it?

What kind of tips/tricks do you use when conference-going? Please share.

6 Comments
05 May 2008

The Amazing 5 Day Work Week

There are a few folks out there extolling the virtues of a 4 day work week. Personally I think it’s the ideal scenario. But for us service-based companies who whose time-worked is proportional to generated revenue, this blue pill is a harder one to swallow.

Working a four-day week is much harder if you run a service-based company. For instance, design companies will have to really work hard to keep a four-day week, simply because clients will expect you to be in the office five days a week. 1

Side Products

I keep seeing more and more service-based companies branch out into the world of products. Frankly, it’s what I’m trying to do with YikeSite. Create a great product that people will actually pay you money for and see it provide a good source revenue. Very enticing to small companies and freelancers looking to supplement their client work.

Finding Time

I give myself until noon each day to work on my side projects – be it my blog, side projects or R&D. The mornings are shorter anyways with 3 hours of workable time compared to the typical 5-ish hours in the afternoon. The afternoon is for client work.

Knowing that I have this time constraint makes me want to get my lazy butt out of bed and to work on time or earlier. It also makes me want to grab the fastest lunch possible because I give myself basically until 1pm to start said client work.

Of course, I have to take calls in the morning (I was interrupted by a conference call in the middle of writing this post) and put out any fires that can’t be postponed. And some weeks just don’t fit with this schedule. But overall, this is where I’ve been able to find time to stay focus and keep momentum on the things that get me really excited.

Keeping Momentum

When you break a big project into smaller chunks — into tiny projects — you stand a better chance at maintaining motivation and rekindling interest.2

37Signals had a really interesting article about maintaining motivation and momentum on projects by breaking them down into chunks. As a sound engineer and musician, I’ve spent countless hours looking at sound waves so this illustration really spoke to me.

By only working a couple of hours each day on your side project, this forces you into this methodology which makes total sense to me.

But The Cool Kids Do It!

It’s really hard not to drink the kool-aid with all of the cool kids. And it’s this part that really gets my goat…

Three-day weekends mean people come back extra refreshed on Monday. Three-day weekends mean people come back happier on Monday. Three-day weekends mean people actually work harder and more efficiently during the four-day work week.3

Until then, I look forward to answering your e-mails 5 days per week :)

1 The Four-Day Week Challenge Ryan Carson

2 Tiny projects keep it new Jason Fried

3 Workplace experiments Jason Fried

4 Comments
28 Apr 2008

The Whuffie Index

Whuffie is a new term we’re about to hear a lot of with regards to social media, online communities and internet presence.

I believe the term was originally coined in the sci-fi novel Down and Out in the Magic Kingdom (2003) by Canadian author Cory Doctorow. In this story, Whuffie is a “reputation-based” currency that replaces money, is constantly being updated and is instantly viewable to anyone at any time.

A person’s Whuffie is a general measurement of his or her overall reputation, and Whuffie is lost and gained according to a person’s favorable or unfavorable actions.1

In Tara Hunt’s upcoming book The Whuffie Factor, she relates Whuffie as the “Social Capital” in online communities. The more you’re engaged with your community, the more Social Capital you raise.

The more you interact on Twitter, the more people will interact with you, which attracts others to you as well.2

Just For Fun

The idea that one’s Social Whuffie is always changing got me thinking about how Alexa ranks the most popular sites based on traffic. This is totally ridiculous, but what if one’s Whuffie was also indexed?

Just for fun, I spent a few minutes and mocked up what an index might look like. I based this off of the Victoria Start-up Index (notice YikeSite and Apricado by the way).

Rank +/- Name Whuffie
1 +21 Tara Hunt 3,454,234
2 +2 Ze Frank 3,150,001
3 -1 Kevin Rose 2,980,234
4 +2 Ryan Carson 2,001,243
5 -2 David Heinemeier Hansson 1,800,339
6 +4 Om Malik 1,632,990
7 -5 Guy Kawasaki 1,614,635
8 -7 Michael Arrington 1,424,014
9 +1 Gary Vaynerchuk 1,231,323
10 +23 Your Name Here :) 1,000,207

The Whuffie Algorithm

Examples of how you gain your Whuffie:

  • For each social network you belong to: +50 (plus +1 for every “friend”)
  • For every Twitter/Pownce Message: +5
  • If you have a blog: Instant +500
  • For every blog post: +50 ( x Number of Subscribers)
  • If you host a video podcast: Instant +1,000
  • For every video podcast episode: +100 ( x Number of Subscribers)
  • If you have a Tumblog: Instant +300
  • For every Tumblog entry: +25
  • For every conference you attend: +200 (Plus bonus +5 for each #tweet)
  • For every conference you speak at: +10,000
  • Create a popular web framework: +750,000
  • Get mentioned on Digg, TechCrunch, etc: +3,000

Examples of how you loose your Whuffie:

  • Trash talk somebody: -1000
  • Trash talk somebody and get called on it: -2000 (per incident)
  • Create a blog post, Twitter/Pownce message or video update that offends the majority of people who see it. -3000
  • Twitter about doing laundry -50

Help me add to this list, add more examples in the comments.

1 Whuffie Wikipedia

2 Tweeting for Companies Tara Hunt

19 Comments
14 Apr 2008

Dads, Get An Office

People considering working at home generally weigh the benefits and challenges but opt for the home office anyways. My guess however is that over time a lot of people will eventually find the opposite and move to an office space outside of the home.

One of the best decisions I’ve made as an entrepreneur was to move my work life outside of my home. It took years before this idea became even remotely something I would consider. I mean, why would I? On paper, it’s a pretty sweet deal.

“Daddy, I Know You’re In There!”

The tipping point for me was having a toddler in the house. When my son was a baby, working from home was great because I could be there for my wife when she needed me. Simple tasks like taking a shower and making food can really become quite difficult when you got a baby strapped to you. I didn’t mind one bit holding my baby throughout the day.

Then he got older, mobile and vocal. He would know when I was behind that closed door. It became impossible to get work done and it felt like I was a bad father sitting there trying to not open the door as he was crying “daaaaaadddyyy!”. That door didn’t stay closed for long. All I wanted to do was hang out with them all day long.

The 3 Hour Family Lunch Break

At least a few times in the day I’d hear the two of them having way too much fun than I was prepared to miss out on. Hearing laughter from the other room made me want to investigate. Maybe it’s the first time he’s discovering bubbles or maybe he’s practicing with his newly discovered walking legs. I just really wanted to be there. A quick lunch break would turn into play time, an outing or a nap (or all three).

Being flexible with my time, I thought I’d just catch up the time in the evening. This rarely happened because nobody can resist a sleepy baby when you yourself are feeling a little drowsy. When I did catch up on work in the evening it felt that this took away from “family time”. This lead to, what felt like, really long and drawn out days.

Kicked Out

It was actually my wife who was the biggest supporter in me having a place to work outside of home. We both needed a good chunk of time out of the day where I was in “Dad Mode” instead of somewhere between “Work Mode” and “Dad Mode”. The in between mode really didn’t serve anybody (family, me, clients).

Having an office has been great. When I’m at work, I’m at work and when I’m at home, I’m home. In general this has solved the issues around the work/home balance and I still have the flexibility to be there for my wife and son if they are really needing me. And I reckon I’ll take advantage of this again with the next baby.

5 Comments
11 Apr 2008

Wear Clothes At Home

People who work from home get a pretty sweet deal: Pants are optional.

When I first started working from home, I’d brag that I could sit in my underwear while taking a client call or wake up by noon and work all night. It was cool for a while but eventually got old.

I found that I’d wake up and get stuck into work right away before even grabbing something to eat let alone getting dressed. It would be 11 or 12 until I hopped in the shower, got dressed and got motivated.

After a while it just felt that the days (mornings especially) dragged on and on. I needed that shower to hit my “reset” button and go at it for another day.

Dress For Success At Home

One thing I figured out after a few years of doing this was that choosing the right clothes became very important. Instead of having a shower and throwing on a sweet tracksuit, I found that I needed to take my self seriously. For me this meant jeans and a button-up shirt – oh and doing my hair.

I now have an office outside of the home but those days I do take a “home day”, I still remember to wear pants.

Next up in the series:Dads, Get An Office

1 Comment
07 Apr 2008

Allow Myself To Introduce Myself

Hey there, my name is Jeff Ward and you have reached my very first blog entry. I’ve procrastinated starting this blog for a lot of reasons. But I finally did start this blog for the following reasons:

  1. Use writing as a tool to help me decide how I really feel about what I feel. On business, web-apps, personal growth & family life.
  2. Get myself out there in the world a little more and hopefully meet some cool people and do some cool stuff.
  3. Share my experiences and maybe help a few people along the way.

Looks like the basis of a blog mission statement. Ugh, off to a bad start already. If I could make mantra all of the above, I would go with – “Jeff, Inside & Out”. Grab the domain name and off we go!

15 Comments