A quick retrospective on my "The Shippening" experience

I think it was a week or two back when Papa Smoosh came up with the idea for The Shippening. A quick virtual "hackathon" where a bunch of devs would try to build and deliver a product idea. We all got together on Discord (here's an invite), chatted, and got off to a shaky start. That's coming to a close for most members at around this time. Most of us started on the 27th but there were no hard rules. Just spend 72 hours working on a product.

Check out @jevakallio's twitter thread for his experiences. (and you can also check out my tweets with updates).

I wanted to quickly share mine and possible address some of those points listed in the tweet in a "best, good, bad, ugly" breakdown

My product 📷

My idea was to build "Skok", a (desktop) photo management app that could scan a directory for photos, save the results in a database, and query on it in different ways. On top of that, it would display those photos and lay ground for bigger and better features including:

1. moving photos into a better directory structure
2. photo deduplication based off file md5 hash
3. ability to select photos and copy them
4. display photos on a map based on EXIF data
5. "On this day" functionality to display photos taken on that date throughout years

The app idea stemmed from a real need that I felt like was not met by the market: auto-organization of photos in a consistent way, deduplication, and moving/querying photo data. Most important of all (and what gave me this idea), there's no "Timehop" for desktop and I really want that.

If you want to follow along with the product, 👉follow me on Twitter, 📧 subscribe to my newsletter, or just 📝check my blog at least occasionally.

The Best 🎉

• minimal scope
• planning/thinking about the product beforehand
• use a stack you know or have at least tested.

One of the biggest difficulties building under a super tight deadline is the scope. Scope creep is real, misestimating what you can or cannot do is totally expected, and any hiccups along the way propagate much faster than at a regular job.

I've been thinking about Skok for literally 2 years. Scope was something I had down because I knew it could easily blow up. The scope for the Shippening was UI + scanning + displaying data. Nothing too fancy. It was an achievable goal.

I've spent the past couple of years also heavily working on project estimation and cutting down on scope. It's part of my every day job to think about those things, adjust timelines, figure out (to the detail) what needs to be done, adjusting to that, etc.

For this part, I was in my element.

Stack wasn't too bad either. I spent 2 years looking into it. I used several build tools (Rollup, Webpack, Parcel) to test them out, all the major front-end frameworks (Vue, React, Angular, and even tried Cycle), and I looked into the best way to create a desktop app for someone like me with no desktop experience. So I ended up building several small apps in Electron. That prior research was everything that made this project a success.

Final stack:

1. Electron with TypeScript
2. React (JS ES2015+) with Parcel compiler
3. SCSS for styles -- custom grid and custom everything
4. written-from-scratch library for Main <=> Render processes communication
5. "walker" NPM package for walking directories/files (I heavily tested this one for work purposes)

And I say "final stack" because...well, read on.

The Good 🙌

• starting the product and putting it into a "workable" condition is huge
• community of others doing the same can be super encouraging

I'd say the good thing is the final result. Having thought about this app for 2 years means I did not write a single line of code for it. Now I have a whole setup and dev workflow that isn't too bad. It's actually pretty enjoyable. Plus, I'm learning React (again, for the 6th time) so I have a good outlet for that. I'm also interested in Parcel's future development, again, great outlet for that.

Sometimes writing the first line of code is hardest but I think for a developer, the hardest thing is setting up the dev environment just right and writing the first line of code directly for the product. I'm past that stage albeit in a cumbersome way. I know that for me, the dev environment can be turn me away from the project immediately.

Secondly, being part of the community is what got me started on the project and it's what kept me going. Jevakallio's posts were encouraging. I wanted to share my accomplishments with the group and so I did. I even made a quick YT video explaining how I set up Electron's main/renderer threads to communicate (won't link it, not really a good video haha).

The Bad 🙁

• spending too much time making a "time-saving" tool work before defaulting to the planned stack
• design might be last thing you want to focus on but having an "ugly" app and no design preparations can be super discouraging
• the stack still isn't ideal but it's the best one from what I can tell

So with a stack in hand, I ran into the first issues. I tried to sidestep my own experience with Electron, Parcel, and React and use another tool that I've never tested because I was hoping that it'd streamline my workflow further and help me avoid future complications.

Unfortunately, this "all in one" electron tool ended up being broken on Windows for the past couple of months. With Electron 4's release, it was "outdated" (not really but it just didn't support Electron 4 yet), and it was slated for a better version very soon that changed how the tool worked entirely.

I had the good forethought to test the tool out before The Shippening started, unfortunately, that time could have been better spent setting up all of the initial tools had I just stuck to what I knew well.

The other thing that sucked was CSS. I love CSS. CSS is great but I suck at putting CSS together to make things look nice from the default styles. I built a solid grid, I built a nice button and that was it.

I don't have access to Illustrator anymore and so mocking stuff up (as I'm used to) wasn't an option. This was a huge problem. All I could think about was "Fuck, this app is ugly" and that was discouraging. Illustrator has been a huge go-to for me for sketching out site layouts and designs.

And when I have even the simplest designs to look at, it's easier for me to code the styles and feel good about the app's look. It might not be the most important thing in the world but I hate working on ugly products.

Lastly, the stack is still not ideal. Or rather, the development environment isn't. Parcel is great...but it took a bit of work to make it work with Electron. Electron still requires a full restart on back-end change. I still can't just "run" something and expect it to compile and work.

Parcel comes SUPER close and is by far my favorite tool out there but still, I don't know how I can make it work to compile the front-end and back-end at the same time (is that possible?). Plus...no tsx support as far as I know. Live-reload doesn't seem to exist for the Electron front-end either. :/

The Ugly 😱😱😱

• timing

The timing. It was horrible timing. I'm super busy between Christmas and New Year's. Work was hectic, and personal life more so. I celebrate the New Year's the Russian way which means gifts, planning, and stress. I was wrapping gifts rather than working on the app. I was busy working on a project and getting too tired to code my app later.

I'm glad there were no other uglies :)

Have you tried anything similar? What's your experience with tight-deadline prototypes?