Skip to content

A Developer’s Guide to Startup Weekend

December 1, 2014

I’ve terribly neglected this blog for the last several, well years. So while I’m pulling myself out of my post Thanksgiving stupor, I thought I’d get out a quick article.

Last weekend I did something I’ve never done before, but will definitely do again. I participated in a startup weekend. Startup Weekend EDU Seattle, to be precise. And, I had a blast! My team worked on a SaaS idea to capture educational artifacts that occur throughout a school day, and intelligently organize those artifacts for stake holders to later recall and utilize for a variety of purposes.

When you register for a startup weekend, you identify yourself as either a developer, designer, business/marketing, or specialist — in this case an educator. Of course I signed up as a developer.

Having never participated in one of these events before, and being me, I somewhat over prepared. So, here’s some thoughts on what to do, and perhaps not do, when attending your first startup weekend as a developer.

Your Role

I ended up fulfilling the role of front end developer. You really don’t know going in what you’ll be doing. The teams are small, and organically created, so you’ll take whatever role needs doing. And, probably several. Just like, well working in a startup.

Laptop

Everyone on my team brought a laptop, and I suppose the same was true for everyone there. I can imagine someone showing up without one, and still being an asset to a team, but probably not as a developer.

My laptop started showing problems early on Saturday, and in fact crashed for good after the event on Sunday night. A failed logic board I believe. And two months after AppleCare ran out. I have a new MacBook on it’s way now, and am typing this on an iPad. So, backup your laptop! Regularly! Mine was, and my data is safe. But still, this is a final warning.

Languages and Frameworks

The team I ended up in was six people strong, with four of us being developers. Three were most comfortable with Rails. I’ve read a bit, and done some tutorials, but Ruby is not my language. Nonetheless, I quickly concurred that Rails was the way to go. It was a good decision. All of us worked well together, and there was plenty of non-Ruby work for me to do.

Whatever your strongest language or framework might be, no matter how popular, might not be what’s needed, and that’s great. You’re there to learn and have a new experience after all, right? You’re more than one skill! Something you know will end up being critical to the success of your team. You just have to trust me on this. Language is the least of your worries.

That being said, your focus will be producing, or mocking up, your team’s most viable product (MVP) by Sunday afternoon. So, you’ll be hacking together code, rather than meticulously planning everything out. I’m normally all about elegant code, but there’s no points for that here. Just make the demo work.

Software and Services

I went in with a brand new empty public repository on GitHub, with an associated working copy on my laptop. Good thing too, because when the laptop started to fail that repository was possibly going to be my lifeline. I used Cornerstone SVN client and BBEdit as my primary development stack. The other three devs in my team were using Atom, and Heroku. I had all but forgotten I even had an account with Heroku, but that came in handy. Having accounts and some familiarity with these as well as DropBox, Google Drive, and possibly OneDrive (favored by the educator in our team) might be helpful.

One of the developers in our team had Photoshop on her laptop, which she used to create icons for the mobile app. I used Keynote and Apple’s Preview to create what graphics I needed for the website. A surprisingly powerful pair, but certainly no Photoshop. I couldn’t get GIMP to run, which might have been that logic board issue. Mostly though, I just avoided graphic needs, by using icons and glyphs already in an HTML framework (I used a blog-centric version of Bootstrap for this). If we had a dedicated designer on our team, this probably would have been different.

When we weren’t together, our team communicated by text message, and the organizers pushed Twitter as a means of promoting the event, so get used to both. I’m sure other social media was being used at the event as well. If you’re not a social media person, you’ll probably not end up being in charge of that for your startup, but you’ll need to at least participate with your team.

Computer Accessories

We did most of the collaboration over services like GitHub and Heroku, but a thumb drive was essential, especially during the last minute push on Sunday afternoon. You’ll of course need to power your laptop, so bring your charging cable. At least one charging cable got lost, so you want to write your name and phone number on yours. If your laptop is used in the presentation, you’ll need the appropriate monitor adapters. Usually that means a VGA output, but I thought I heard someone mention HDMI, so bring what you have. These can get lost in the shuffle between presenters, so again write your name and number on them. I had a bunch of other stuff with me — cables, task light, a power strip — but none of it was needed.

Internet Access

We had great internet access at our venue — Seattle Public Central Library. But don’t count on this. Be prepared to do what you can without the internet. I made sure I downloaded some docs and cheat sheets I normally just check online. Storing them as PDFs in iBook on my phone worked well. Most laptops can act as a wireless hub for collaborating, and I suspect some teams in our weekend were doing just that.

Paper and Pens

I had several different pens along, and a 9×12 spiral bound sketch pad. I really only used about two 0.5 tip gel pens for sketching designs and taking notes. The sketch pad came in very handy, and a couple of my team members borrowed it occasionally. I like the 9×12 size due to my background in graphic design. Really, a standard letter sized pad would have worked as well.

Office Supplies

I also had a small assortment of office supplies in my bag. My team members are only finding this out reading this now. None of it was needed, and just contributed extra weight to my bag. The organizers supplied big 20×30 poster pads for brainstorming, sharpie markers, and more post-it notes than I’ve seen in years. Every white board I saw had at least one dry erase pen available. Tape was supplied when needed. So again, nothing I brought was needed. Save yourself the back strain, and leave it all at home.

Clothing

Dress comfortably. Casual Friday comfortably. We spent our days sitting around large tables, working with laptops, pens, and papers. During presentations we were sitting in a movie theater-like forum. No one is expecting suit and tie, but dress for office work.

Sleep

The venue we were in closed down at 11:00 PM, and opened at 9:00 AM. So we did have some fixed start and end times for the days. I ended up doing a bit of work on my own for an hour or so before and after each day. And at least one of our team had a very short Saturday night. But pulling all-nighters was absolutely not necessary. In fact, I’d guess they’d end up being detrimental. Get your sleep! Go in being as rested as possible (many complete a full day’s work before arriving on Friday), and try to stay rested all weekend. You’ll do your best work that way.

Food

We were well fed, there was always enough, and it was always tasty. Coffee was available all day, but bottled water and soda mysteriously vanished at the end of each meal. If you’re like me and don’t drink coffee, but like having something to drink around, grab an extra water with each meal to keep with you. One of the sponsors was KIND, so the ubiquitous snacks was their bars. The selection was limited, and while I like KIND granola, I’m not a huge peanut butter fan as an ingredient. So I chose to forego the peanut butter flavored KIND bars. Luckily, I had along these Trader Joes green tea mints I’m addicted to. If you have something similar you’re always popping in your mouth, bring it along. But either way, you won’t starve.

I have no dietary restrictions, but I did notice there was always a vegetarian option. Perhaps this was just due to being in Seattle. If you have any restrictions beyond this, I’d suggest contacting the organizers with your concerns, and see what you’ll need to bring with you.

Participants

Don’t give a moments concern to who you’ll be working with, or whether you’ll be accepted on a team. Everyone was fantastic. I’m a people person. But like everyone, I know there are some personality types I don’t favor. It’s 54 hours. You can get along with anyone for 54 hours. Besides, everyone there is in the same position. Few if any of them know anyone else, and they all came to get the job done. Everyone found a team, every team could probably have used more participants. Whatever unique set of skills you have, there’s a team that can use them. And you might just find or validate a skill you haven’t thought about in quite a while.

Judges, Coaches and Organizers

All of the people who went into making the weekend happen were amazing. Before I went, I had read somewhere to read up on the judges. That wasn’t really necessary. But, I did review the names, photos, and bios of all involved, provided on the event’s website. This helped me keep everyone’s name straight, and to feel a bit more connected while I was there.

Registering

I watched the registration page on EventBrite for several weeks before taking the leap. This event at least filled slowly at first, and then filled up very quickly nearer to the start date. I talked to one participant who had to do some wheeling and dealing (he didn’t explain what) to get in at the last minute. If you’re interested, register now! You won’t regret the decision, and it will fill up.

Lodging

I live about an hour by bus from the venue, and I don’t know how far by car during rush hour. So, I chose to get a hotel room within walking distance of the venue for Friday and Saturday night. That was an expensive choice, and one I probably wouldn’t make again. Taking the bus would have been sufficient, and I could have done on the bus, any of the work I did in my hotel room.

Take the Leap!

My experience at this Startup Weekend was awesome, and I can’t wait to do this again. I don’t remember where I heard of this opportunity, possibly a LinkedIn group, or Seattle Tech Startup’s mailing list. I just don’t know. But I’ll definitely be keeping my eye out for similar happenings. If you’ve read this far through, I strongly suggest you do as well.

Hopefully, this post was in some way helpful. If you have any questions or addition thoughts, please leave them in the comments.

Social Media Badges in an OmniGraffle Stencil

September 29, 2011

When mocking up website designs, it’s empowering to work with graphics that do not have a finished look about them. It frees you up to experiment, and risk “getting it wrong”. I use apirak’s “Web Sketch Interface v2” OmniGraffle stencil from Graffletopia to plan my website look and feel. I’ve recently been trying to give back, by offering common elements in a similar style. Here’s my stencil for social media badges. It’s available for download from Graffletopia. It’s a short list, but one I’ll probably be expanding upon in the near future.

Preview of Web Sketch Social Media Badges stencil

Social Media badges in a "sketch" style, for mocking up web UX designs. Includes: Twitter, Facebook, StumbleUpon, Delicious, Digg, Reddit, Linkedin, MySpace, FriendFeed, RSS, Flickr, Technorati, YouTube, and Bebo.

CSS3 Compliant Cursors in an OmniGraffle Stencil

July 10, 2011

I use apirak’s “Web Sketch Interface v2” OmniGraffle stencil from Graffletopia to plan my website designs. It is my go-to stencil. However, I recently needed a group of CSS3 compliant cursors (like pointer, and crosshair), and couldn’t find anything for OmniGraffle that didn’t have a white background, or just not match my need. So, I spent a little time this Sunday whipping up just what I needed. It’s available for download from Graffletopia. I hope others find it useful.

Preview image of Web Sketch Cursors available from Graffletopia

CSS3 Compliant cursors in a "sketch" style, for mocking up web UX designs. Includes: default, crosshair, pointer, move, text, wait, help, progress, not allowed, vertical text, and several resize arrows.

Students, and the Courses They Never Started

April 27, 2011

I struggled with this SQL problem a bit longer than it probably should have taken. Hopefully this post prevents another from doing the same.

The table structure I was working with contained a ‘student-table’, ‘course-table’, and a ‘merge-table-with-extra-data’. A pretty basic many-to-many relationship between Students and Courses, along with a date for when each relationship started.


CREATE TABLE `Students` (
`student_id` int(11) NOT NULL AUTO_INCREMENT,
`student_name` varchar(128) DEFAULT NULL,
PRIMARY KEY (`student_id `),
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

CREATE TABLE `StudentCourses` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`student_id` int(11) DEFAULT NULL,
`course_id` int(11) DEFAULT NULL,
`date_started` timestamp NULL DEFAULT NULL,
PRIMARY KEY (`id`),
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

CREATE TABLE `Courses` (
`course_id` int(11) NOT NULL AUTO_INCREMENT,
`lesson_name` varchar(128) DEFAULT NULL,
PRIMARY KEY (`course_id `),
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

What I needed from this was a list of students, and the courses they did not start between two given dates. This was a seemingly easy problem, until I actually tried to accomplish the task.

student_name lesson_name
Doug Burchard Bull Frog Mating Rituals
Doug Burchard Worm Tunneling and Moles
John Green Nest Building for Birds
Susan Archer Swimming with Sharks
Travis Dodge Swimming with Sharks

The solution: First, I created a sub-select of every possible student/course combination; then I created a second sub-select of every existing row in StudentCourses created between the two given dates; finally, I left outer joined the first sub-select to the second by both the student_id and course_id, and retained every row where this join had failed.


SELECT m.`student_name`, m.`lesson_name`

FROM (SELECT s.`student_id`, s.`student_name`, c.`course_id, c.`lesson_name`
FROM `Courses` AS c
LEFT JOIN `Students` AS s ON 1 = 1) AS m

LEFT OUTER JOIN (SELECT `id`, `course_id`, `student_id`
FROM `StudentCourses`
WHERE `date_started `>'2010-7-1 AND `date_started `<'2010-8-1') AS sc ON m.`course_id` = sc.`course_id` AND m.`student_id` = sc.`student_id`

WHERE sc.`id` IS NULL

OS Upgrade Haunted by Ghost-account?

October 23, 2009
tags:

I just got done wiping my drive, loading Snow Leopard, and restoring my files from a cloned backup. Almost everything worked as expected. The Lasso-user refused to be restored — it never finished calculating the directory size, and I had to deselect it to continue the restoration process. Once I was back up and running, I reinstalled iTools9, Tenon’s PHP and MySQL add-ons, and Lasso 8.5.6. I had to copy and paste from the old virtual host config file to the new one, but that brought everything up except MySQL.

As hard as I tried, I couldn’t get the MySQL Server to launch. I messed around with it for hours. I read log files, re-re-installed applications. I re-restarted the machine. I manually launched and re-launched executables. Nothing seemed to work. The only other symptom remotely associated was that in the iTools9 Admin site, the System Status pane took an enormous amount of time to load, sometimes never loading.

Finally I thought to just wipe everything associated with webserving, and re-install again. I thought I’d start by removing the extra users on the system. So, I swapped over to my admin-account, brought up System Preferences, selected the MySQL-user, and clicked the delete key. Something strange happened, the MySQL-user didn’t dissapear, but it did change names from “MySQL” to “MySQL Server”.

I thought that perhaps there were two MySQL-user accounts, and one had been masking the other. So before I did anything else, I jumped back to my client-account, brought up the iTools Admin site, and opened the System Status pane. It opened up immediately — no long delay like before. Then I clicked the “restart” button for MySQL Server, and MySQL started right up.

I don’t know if my assumption, of there being two MySQL-user accounts, is exactly correct. But, everything’s working now, and I’m just hoping this helps someone else. When I upgrade the operating system in the future, I’ll not restore the MySQL-user in the first place, instead just let the iTools instal create a new user, and manually import the data-files from the cloned backup.

Is CSS Enabled?

October 1, 2009

I’ve seen this question posed many times on different forums.

How can one tell if CSS is enabled/disabled using Javascript?

Well, there is a method of doing this, sort of. If CSS is disabled, an @import directive will never get followed. Simply import a CSS file with a un-noticeable styling to an element. Then, use Javascript (I like the jQuery framework) to test whether this style is true of false. For example, use this structure to style a <div>-container that’s on every page to have a white background-color. Then test for this later.

Example CSS (csscheck.css)

#body {
background-color:white;
}

Example HTML

<!DOCTYPE HTML>
<html lang="en-us">
<head>
<style type="text/css"> @import "csscheck.css" </style>
</head>
<body>
<div id="page">
... your content here ...
</div>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<!--
$(document).ready(function(){
var bodyBackground = $('#body').css("background-color");
if (bodyBackground == "rgb(255, 255, 255)") {
... script steps if CSS is enabled ...
} else {
... script steps if CSS is disabled ...
}
});
//-->
</script>
</body>
</html>

The downsides of this method are that older browsers — for the most part v4 browsers and below — don’t understand the @import directive in the first place, but do understand some CSS. And, of course, this adds just one more file to be downloaded, no matter how small. So, code defensively, and test on several browsers, including older versions.

Focus group disses ThickBox

September 30, 2009

I’ve used the ThickBox jQuery-plugin on several projects now. It’s easy to integrate, and flexible in it uses. For example, the first time I used it was to provide a FCKEditor-window that wouldn’t fit in the limited space of that website’s form-area. I definitely recommend ThickBox, if you need a lighbox-effect.

When MyLocalPark.com launched earlier this week, each park-page used ThickBox to display a slideshow of that park’s photos. This feature went together easily, and was something I’ve built in the past for clients. However, my focus-group didn’t appreciate the feature quite as much as I did. They got confused when they clicked into the lightbox-effect, and naturally used their browser’s back-button to try to get back to the park-screen. Since ThickBox doesn’t change the actual location (meaning the URL), only the appearance of the screen, the focus-group’s respective back-buttons returned them to the browse-page, found-parks-page, or home-page, depending on where they were before they navigated to the park-page.

To fix this problem I replaced the lightbox-effect with a seperate purpose-built page for scrolling through a park’s photos. While I could have easily told myself the focus-group “just didn’t understand technology” (actually, I did tell myself this for a couple of hours), in the end I knew I had to trust what they were telling me. The final slideshow-page took it’s inspiration from Flickr, and who knows more than them about displaying photo-sets on the web?