Categories
Hackathon iOS Development

ATX Hack for Change: Volunteer Recognition App for Austin Pets Alive!

Austin’s no-kill animal rescue organization, Austin Pets Alive! had the honor of being selected as one of the possible projects for the ATX Hack For Change at St. Edwards University on June 2-4, 2017. My wife Cheri and I ran into one of the organizers at OSCON in early May, and we were able to submit a volunteer recognition app project that APA! needed, but hadn’t developed yet.

Austin Pets Alive! brought a team of hackers (Cheri Linwood, Beth Qiang, Walter Moreira, and myself), along with two dogs (Nimbus and Shorty). Nimbus and Shorty didn’t contribute much in the way of code or ideas, but they did provide puppy power for the hackathon.

As for the technical details – the volunteer recognition app uses Swift for the native mobile app on iOS, and Firebase as the back-end server for everything (Firebase Auth, Storage, Database). Check out the MIT-licensed source code here on my GitHub at https://github.com/jefflinwood/volunteer-recognition-ios. This was the result of about 12 hours of coding over the weekend. One of my big goals was to find a visual designer at the hackathon, but they were few and far between, so I did the visual design myself. Luckily, APA! has pretty strong colors, so that makes up for a lot.

Categories
Hackathon

Journalism Hackathon 2015

The University of Texas at Austin School of Journalism and the Austin American Statesman both sponsored the first Journalism Hackathon, which was a success, especially for a first year event.

This was my first time organizing a hackathon – as part of a team including Robert Quigley and R.B. Brenner from the School of Journalism, and Christian McDonald and Andrew Chavez from the Statesman (they both also teach at the University of Texas in the School of Journalism as well). I’d like to thank Mashery, Microsoft, and Clarify for coming to the hackathon to show everyone what their technology does, and how it could apply to the changing world of journalism.

Many of the participants had never been to a hackathon before, and in fact were kind of intimidated – maybe the combination of “hacking” and “marathon” really doesn’t sound that friendly! From the beginning, we wanted to organize a friendly hackathon, where the focus was on learning something new, getting to know the other participants, and accomplishing something!

The highlight of the hackathon was the tour of the Statesman’s newspaper printing presses, led by Christian McDonald – the presses were busy churning out the next day’s paper. One of the most interesting facts we learned is that the Statesman prints many other newspapers as well – it’s just cheaper for these other papers to get rid of their printing presses, and run their paper copies off on the Statesman’s presses.

Categories
Hackathon Uncategorized Wearables

Samsung Gear Smartwatch App: Knitting Puppy Row Counter

Knitting Puppy Gear App

I recently got a Samsung Gear 2 Neo smart watch – it pairs with recent, powerful Samsung phones and tablets, but without them, it’s basically a pedometer. So I’d definitely only recommend it if you already have one of their recent devices (like the Samsung Galaxy S5 or Note 3 phones), and not if you use an iPhone or a non-Samsung Android phone.

I got mine to see how the form factor could work (now that Android Wear is out, and it’s likely that Apple will release some sort of wearable device in the fall), and to try writing a few apps for it. The Gear watches run Tizen, which is an HTML5/Linux-based environment, so if you are comfortable with HTML, Javascript, and CSS, it’s pretty easy to get an app going. The biggest problem is the screen – it’s about 1.7 inches on each side, and 320 pixels on each side. So you have a limited amount of screen real estate for user interface elements.

I designed a knitting counter for my wife – there are a lot of simple plastic devices (such as this one) that do the same thing. Basically, you can keep track of how many rows you’ve knitted for a project, and then swipe across the number to reset it.

The Gear watch supports HTML Touch Events, so I was able to hook into a swipe event to do the reset. I used a swipe gesture because the screen is so small, it’s quite easy to hit the wrong button if you have two on the screen next to each other. My original design had a reset button underneath the “Rows Finished” button, and I ended up hitting the wrong button a lot. With the gesture, it’s a lot harder to make that mistake.

If you have a Gear watch, the app should be approved by Samsung soon! I entered it in the Samsung Gear App Challenge, so I’ll be curious to find out how it does in the challenge. Here’s the video submission I made for the app if you want to see it in action:

 

Categories
Hackathon iPhone Development

Slash Hackathon for SXSW

On Wednesday, I got a chance to pitch my six-hour hackathon project to Slash (lead guitarist for Guns and Roses and Velvet Revolver), tech blogger (and Startup Liason Officer for RackSpace) Robert Scoble, and the inventor of BitTorrent, Bram Cohen. The idea behind the hackathon was to create an app or web site for artists to connect with their fans, and if Slash thought your idea was the winning one, he’d use it for his upcoming album in 2014.

Slash

I came down to the Slashathon with an idea all thought out and ready to go, basically an app for users to try upcoming music from albums and rate it as hot-or-not. Nothing too crazy, but I don’t particularly know what a band would want to use to engage their fans, so I wasn’t particularly tied to the idea.

This hackathon had more sponsors and API partners than I had ever seen at one event – some of them had just created API’s for this event and released them to the public. Muzik Headphones came with their developer-friendly wireless headphones, which I didn’t get a chance to include in my hack, but would like to put into a different project soon. Geeklist organized the event with The Collective, and it was held at the Capital Factory in downtown Austin.

After watching Qualcomm’s team show off their Gimbal beacons, I decided I wanted to use them for my project instead of my original idea. I’ve been involved in a few projects around location awareness and context, but haven’t had a real chance to sit down and program with any of the beacons yet. A hackathon is perfect for this sort of thing, because if I needed help, Qualcomm had a developer right there to point me in the right direction.

My first idea was to create a whole-house audio system that just used your phone, the Gimbal beacons, and the Muzik headphones with Spotify playlists. Instead of putting in an expensive whole-house custom audio installation, just put a few inexpensive beacons in the different rooms of your house, and have an app that changes up the playlist for you. Ideally, you’d smoothly transition in and out from the playlists, but in a six-hour hackathon, that’s the sort of detail that can get left for the future.

This idea worked pretty well – I had some problems with the Spotify iOS SDK, because I had a Spotify free account (a no-go for streaming, you need Premium), but once I got past all of that, I brought in the Gimbal SDK, and quickly had an app that could detect the different beacons. It was a quick jump from just printing out “New beacon detected” to switching the Spotify stream, so then I went ahead and made the app’s background switch to different iOS 7-style backgrounds, based on your location. This is a nice effect, but I don’t think anyone noticed during my demo.

After talking my idea with the Qualcomm Gimbal team, they asked how it would help artists, and then they suggested the idea of letting the musicians set up custom playlists tied to these beacons – I called them “Proximity Picks”, because they look kind of like Guitar Picks. Artists could include one with their box sets, CDs, or other physical sales, and anyone with my app could listen to the playlist, for instance if you brought the pick to the office.

My App

This was a lot better idea than just the whole-house audio, though you could certainly do that as well with this technology. Because artists could now sell these picks, I added PayPal integration to the app, and basically called it done. We only had from 12pm-7pm to work on the project, so it was a short hackathon.

Jeff Pitching

It was a little bit nerve-wracking to pitch to the hackathon judges, but I felt like I had a decent story behind the project, and Robert Scoble seemed to really like the idea behind a context-aware music mobile app. I ended up winning third place overall behind SlashTV and Retune, and then first place for the Gimbal and PayPal integrations. I also used Spotify as the music provider for the app.

Overall, I liked this hackathon – it had a lot of different API sponsors, which is great, and it’s in an area – music – where I’ve never done a project before. Now that I’ve used the Gimbal beacons, I can recommend using them for location awareness on other projects, which is always nice.

[Thanks to my wife, Cheri for the photography!]

Categories
Hackathon Ruby

BattleHack 2013 World Finals at PayPal Headquarters

At the end of September, I won the BattleHack competition in Austin with PayPup – a mobile app for our local no-kill animal rescue, Austin Pets Alive. This was a project I’d been thinking about doing for over a year, but I needed that 24 hours to sit down and do it – and bringing PayPal into the mix for donations was the missing element to make it worthwhile to everyone.

As a result of winning the local competition, I got an entry into the BattleHack world finals in San Jose, California on November 16 and 17. This was an amazing opportunity to have a chance to go head to head with some of the most talented hackathon developers in the world, as competing teams would show up from ten different cities – Moscow, Tel Aviv, London, Berlin, Barcelona, New York, Miami, Seattle, Washington, DC, and myself from Austin. All of the other teams had at least two people, and most had three or four developers or designers. I was competing solo, as I had basically known what I wanted to build at BattleHack Austin and hadn’t formed a team.

I didn’t really think too much about my idea for the world finals, except a loose concept around fundraising for disaster relief, based on the flooding that happened in southeast Austin on Halloween this year. Then the typhoon struck the Philippines, with incredible amounts of damage and loss of life, and my friend Ronnie headed over to the Philippines  to organize disaster recovery for the area where her family is from. They had a ton of damage there, and it’s not one of the big cities, so it won’t be one of the first areas cleaned up by the government or outside relief organizations.  She asked for money from family and friends, and then kept us informed with updates on Facebook as to how things were going in Manila and then in the disaster area. This started to crystallize some of the ideas I wanted to do!

After flying up from Austin to San Francisco, I had my first ever driver waiting for me with my name on his tablet – usually I wouldn’t have even looked for those guys! The black car ride down to San Jose was pretty uneventful, but I checked in to the hotel around 3pm (meeting the great team from DC in the lobby), to get ready for the video pitch at 4:10pm. I figured that our video pitches would be shown up on a screen somewhere and some point during the weekend, as we weren’t getting judged on the pitches themselves, or even whether we built what we pitched. We had ten minutes of time in front of the camera to give a 1-minute pitch (all the way through, not edited) – I used three takes, after writing down some notes in my hotel room right before the event.

The next item on the agenda was to meet all the other developers at a dinner in our hotel that night – we’d also be meeting the PayPal developer evangelists we’d be working with that weekend. Overall, it was an extremely friendly event – I was a little worried that with $100,000 on the line for the winners, the other teams would have their guards up, whether they were being rude or just unfriendly, but it was basically the opposite. That really impressed me.

After dinner, we had a little free time to get ready for the next day (which started at 9:45am with a bus over to PayPal headquarters). I was exhausted after getting up at 6am to catch my flight from Austin, and I can only imagine how tired the developers from overseas were – apparently Team Moscow felt pretty good, because they rented a car and drove up to the Golden Gate bridge that night!

Early the next morning, I woke up and went for a 4 mile run on San Jose’s brand new Guadalupe River trail, which was a great way to start the morning off. It was just above freezing, but the day was sunny and clear.

BattleHackTrail

For my birthday (which was that Sunday), my wife Cheri got me a lucky Hacker Periodic Table of the Elements shirt – can’t go wrong combining programming with chemistry, in my mind.

BattleHackHackerShirt

The event really started to kickoff after we made our way to PayPal headquarters – the Austin BattleHack was really well organized, but the world finals were over the top – individual video stations playing video from each city’s hackathon, a bar, a DJ station, a hack room with individual tables for each team, and an area set up for the announcements.

BattleHackDJ

Once we got settled in and ready to go, I basically wasted two hours trying to decide whether or not I wanted to build my site with Rails 3.2 or Rails 4, and then if I wanted to use Rails Composer or not. More to the point, I didn’t have a strong idea of what I wanted to do, or how I was going to accomplish it, so I kind of wasted a lot of time. This wasn’t smart! All of the other teams seemed to be building mobile apps, so I went with a responsive web app – even though I mostly do mobile app development these days, part of what I wanted to do at this hackathon (and every hackathon) is stretch my development skills out a little bit further.

At the BattleHack in Austin, I did my first Windows Phone 8 app in C#, and used Windows Azure Mobile Services as a backend for the first time. This time around, I’d use Rails 4 – not vastly different from Rails 3.2, but little things like attr_accessible vs strong parameters were new. Luckily turbolinks appeared to cause absolutely no problems.

After futzing around with Rails installs,  scaffolding, and the paperclip gem for storing images on S3, I decided to clear my head of dev problems and switch over to design. As a one-man team, I couldn’t just rely on a graphic designer or front-end developer, so I had to conceptualize what I wanted as a responsive design. I was able to build my page up using Twitter Bootstrap 3 and DesignModo’s free Flat UI Kit in the browser, getting a static HTML prototype of how I wanted the key page of my site to work. Because I designed in the browser, it wasn’t a lot of work to split this static page out into an application layout and a content page template to get it back into Rails.

RebuildingAppBattleHack

PayPal did an excellent job of feeding us – the hackathon actually stopped the clock for a formal dinner at 5:30pm, where the hackathon judges and mentors rotated between tables.

BattleHackDinner

In addition to this, later that night, a build-your-own pho place rolled into the hackathon area, you could assemble your own bowl out of noodles, vegetables, broth, and sauces! Yum!

BattleHackPho

I didn’t want to sleep, but I was exhausted. Part of PayPal headquarters was turned into a sleeping area, with a cot set up for each team with a PayPal developer blanket. I wasn’t sure how the teams with more than one person were going to handle the cot situation, but it didn’t seem to be a problem for any of them.

BattleHackCot

By this point, I had the basics of the web site down, so I had switched into integrating two key hackathon partner APIs – Twilio and SendGrid – I know that both of these are extremely easy to add in a superficial way, but my web app actually heavily depended on Twilio and SendGrid integration.

In a disaster area, you’re not going to have strong wifi, a reliable 4G internet network, or even possibly access to your own computer or mobile device. Because of this, I wanted users to be able to update their stories using SMS, voicemail, or email updates. This required writing hooks for incoming email using SendGrid’s webhooks, and incoming SMS and voice using Twilio. In addition, I used the Twilio Client to provide a voice recording feature directly from the web browser, for areas here there may have been available wifi (perhaps through satellite uplink) but no reliable voice infrastructure.

Voice was a key part of the application, because I wanted people to be able to record messages for their loved ones – their friends and families would love to hear from them directly that they are ok. Twilio also does a decent job of transcribing those recordings, so I included those as status updates.

Somehow I struggled through to the morning, and I basically had the core of the app done – integrations with SendGrid, Twilio, and PayPal, a Google Map on the home screen, and a compose new update feature that took images, YouTube videos, or links and inserted them on the screen using AJAX. I gave a practice pitch at 10:30 am, and got some excellent feedback on leading with the SMS feature, which I incorporated into my final pitch.

I really just worked on testing and polishing the app for the next two and half hours. I also took several walks around the building to practice giving my pitch, first to myself, and then second over the phone to my mom – I figured if she could understand what I was pitching with no visuals, it would be pretty clear to the judges and audience.

With an hour left, I was basically done. There were things I could improve with the app, but they wouldn’t fit into the demo, so I didn’t bother with them for fear of breaking the hack.

The final presentations went smoothly – I was thrilled to be third, so I wouldn’t have the pressure of leading off, but I wouldn’t be nervous through out the whole presentation by going last – after all, there was $100,000 on the line! Some of the teams appeared to go over their five minute limit, and were being waved off the stage, but I ended my presentation with about 7 seconds left of my five minute limit. The questions from the judges were all well thought out – Sarah Austin asked if you could set up a disaster story over SMS, which I hadn’t thought of before, but would actually be an excellent idea. Jeff Lawson from Twilio asked if I was going to support MMS, and the app could easily support MMS as soon as Twilio opens it up for long telephone numbers! Last, I was asked what technologies I used to build the application (Rails 4, Bootstrap 3, SendGrid, Twilio, Heroku).

The other teams all gave interesting presentations – I liked that none of the teams seemed to be doing the same things, so there was a good cross-section of ideas – NFC, 3-D technology, image recognition, cross-platform mobile apps, and hardware hacks. Some were more practical than others, and some seemed to stretch the limits of available technology. I thought that David Marcus – one of the judges, and President of PayPal – did an excellent job of asking how some of the apps would be used by customers or where they fit into the landscape.

BattleHackTeamLondon
Team London
BattleHackTeamSeattle
Team Seattle (and Macklemore)
BattleHackTeamMoscow
Team Moscow (with the winning project, DonateNow)

 

The period in between when the finalists all presented and when the prizes were announced was really stressful – finally we were called back in for the final judging, and I was thrilled to see that my project had won both the Twilio and SendGrid prizes! The Microsoft and Nokia prizes went to a strong team out of Seattle that demo’d Kinect-based technology, while the first, second, and third prizes went to Team Moscow, Team Tel Aviv, and Team Miami, respectively.

This turned out be a very crazy weekend – out to California on Friday, back to Austin on Monday, teaching my iOS development class Tuesday night, so it took a little while to get back up to speed. I thought the best part of the hackathon was meeting all of the developers on the other teams – I really enjoyed sitting in between two teams of college students (Team DC from Georgetown University, and Team London from the Hackathon Society at the University of Nottingham), and being able to talk about the project with the other solo developer, Jurre from Team Berlin (Team Berlin’s other member was on the business side). I also enjoyed meeting all of the PayPal developer evangelists (Robert, Jonathan, Tim, and Cristiano), along with Kunal from SendGrid and Joel from Twilio.

Categories
Android Hackathon Talks Training

Android Training Class: AppHack Austin – November 9, 2013

I’ll be giving a training class on Android development as part of the AppHack Austin hackathon on November 9 from 3pm-5pm.

It’s a mobile app hackathon, so you can enter an iOS, Android, Windows Phone, Blackberry, or HTML5 mobile app if you want to. Don’t know how to do any of those? Take my intro class on Android development – focusing on what you need to know to create an Android app that calls out to a REST API. From there, you can do a lot of cool mashups with APIs.

https://apphack13austin.eventbrite.com/

Bring a recent laptop (4 gigs or more of ram is nice) – and preinstall the Android developer tools (http://developer.android.com/tools/index.html) – it’s a big download. You can use OS X, Windows, or Linux. Also bring your Android ohone or tablet and it’s charger, and you can start building apps for your own device with no signup or payment required!

There’s a discount code embedded on the Eventbrite page as a riddle.

If you can’t make it to the class, keep an eye out for my new project – Building Mobile Apps – online courses for iOS and Android app development.

Feel free to email me at jlinwood at gmail.com with any questions!

Categories
Hackathon

BattleHack Austin: Video!

I don’t have the video of my pitch for PayPup, but here’s an overview video of the BattleHack Austin event – I actually gave three or four interviews to the video team throughout the course of the event. PayPal did a fantastic job with video production – I think a lot of these developer events benefit from having a video recording.

Categories
Hackathon

BattleHack Austin: PayPup Writeups!

One of the best things about winning PayPal’s BattleHack Austin was to get the word out there about using PayPup as a mobile fundraising platform for animal rescues.

I’m happy to work with animal rescue groups who want to adapt PayPup for their own needs – it shouldn’t be too much work to get this into your organization – you just have to maintain the donation goals for the dogs and cats that have special goals.

My little hackathon app got featured in the AustinStartup – Q&A Wednesday :: PayPal BattleHack Winner Jeff Linwood – one of the most interesting things about this hackathon for me was that I hadn’t built a Windows Phone 8 app before – just a Windows 8 Store app, and that was in HTML and JavaScript. C# turned out to be very straightforward, and adding events to buttons in XAML was so easy compared to Android (iOS is somewhere in the middle).

PayPal also has a great writeup on their blog – Austin Showcases Top Talent in Global Battle Hack – with a great picture of me and my “Austin Winner” battle axe.

Laura Lorek wrote a very nice piece about me in the Silicon Hills news – PayPup Wins PayPal’s Battle Hack in Austin – I was actually talking to her before I presented, and it helped me from getting too nervous before my presentation.

The Austin Business Journal also wrote up my PayPup hack here – Austin app developer is top dog – they might get the prize for wittiest headline.

Overall, I’m thrilled with how BattleHack Austin turned out – I think that if there were easy to use apps out there that you could use to view available shelter and rescue dogs, and encouraged you to help fundraise for the dogs, there could be a lot fewer animals that need to be rescued.

Categories
Hackathon iPhone Development Windows Phone 8 Development

BattleHack Austin: Won First Place with PayPup!

I won first place at BattleHack Austin – PayPal’s hackathon for developers. BattleHack is a series of competitions all over the world, in places like London, Berlin, and New York. Austin’s was held at TechShop, a great maker space up in Round Rock. PayPup Home Screen

 

I ended up building a screen scraper in Ruby, an iPhone app, and a Windows Phone 8 app. Because I made the only Windows Phone 8 app at the hackathon, I also won the Nokia app developer competition. Instead of building a server, I used Windows Azure Mobile Client Services as the backend for the app, as they were one of the sponsors, so I knew I could bug Microsoft’s developer evangelist whenever I got stuck. This worked out really well for what I was doing, especially with the cross-platform support.

The PayPup iOS app is open sourced on GitHub at (https://github.com/jefflinwood/PayPupAppForIOS) – you’ll need to set up your own PayPal and Windows Azure Mobile Client Services accounts and use the corresponding client IDs in the app.

Here’s a link to a story about my app over at the Silicon Hills News.

Categories
Hackathon Ruby Twilio

Talxer: Talk to your e-commerce customers – AngelHack Austin 2013

I was lucky enough to enter quite a few hackathons last year – including API Hack Days in Austin and Dallas, the Via.Me Back to the Future Hackathon and the TwilioCon Hackathon (both in San Francisco), and a DrupalCon Twilio Hackathon in Denver. For the most part I enjoy them, though it is hard to bring a project out of a hackathon into an actual shipping product.

This year, I haven’t had a chance to do any, so I jumped on the opportunity to enter the AngelHack hackathon held at Mass Relevance in downtown Austin.

I actually had a somewhat well planned out idea going into the hackathon about what I wanted to accomplish – a project that would solve problems for two clients I have right now where I as a developer would pay for this solution. It wouldn’t particularly involve integration with any of the sponsors of the hackathon, but for this hackathon, that wasn’t really the focus.

Instead, I ran into Saranyan from Bigcommerce, one of the sponsors of AngelHack Austin. We’d met at Circus Mashimus during SXSW this year when I’d shown up to demo another hackathon project (RV Trip Companion). He mentioned that he’d been talking to Keith Casey from Twilio about how to tie voice into Bigcommerce, so store owners can provide click-to-call to their customers. This sounded like the kind of project I could make a pretty deep dent into in 24 hours, so I switched gears.

Starting with Rails Composer, I built a Software-as-a-Service project in Rails that used Stripe for billing. I then set up the site on Heroku, as that can get a little tricky with Rails Composer web apps. Next was integrating Twilio using some hand-written TwiML as ERB files – I’ll probably replace those with their TwiML builder, but they worked for now. After that, it was time to integrate the Bigcommerce gem, and start to do some customer and order lookup – their API is pretty RESTful, and they have a developer console, so it wasn’t too hard. All of the attributes I wanted to query by were exposed. A little more TwiML, and I had a toll-free hotline ready to go for my e-commerce stores.

Next to build was a click-to-call widget, powered by Twilio’s web client. I knew I’d have to serve a Twilio capability token out of my server up to a third party web site (the e-commerce store), so I built some code that provided the widget functionality as an external JavaScript file served off of my platform to be embedded into the Bigcommerce store.

Integrating with the front-end of Bigcommerce was a little tougher – they use a custom templating/theming engine that you modify chunks of and then upload to your e-commerce store over DAV (think FTP). Digging into it, it wasn’t obvious at first where to put the JavaScript, but I dug through things, and hacked in some JavaScript, some CSS, and my new call and hangup buttons. I got things to look pretty in the default theme using my CSS skills (margin-top:-7px, for instance).

At the same time, I also put together a VoiceBunny project for a full custom voice-over for all of the spoken content for my site. This made everything voice-related feel much more professional, and because VoiceBunny was one of the sponsors, they had a discount code for AngelHack. The voices came in with about 3 hours to go, and I was able to integrate them into Twilio.

I ran into a couple of problems, including wasting time trying to get Heroku to use Ruby 1.9.3 instead of 1.9.1 or 1.9.2 (I just commented out SecureRandom and moved on instead), killing my Stripe integration by accidentally putting another copy of jQuery into my Rails asset pipeline, and using rbenv with Rails Composer instead of rvm (luckily I’d already mostly battled this one out on another project). Another, bigger problem, was that I hosted my MP3 files for the voice over on a basic shared hosting provider, and Twilio’s caching algorithms would work much better if they were served out of something that properly handles HTTP caching (such as the Rails asset pipeline). These collectively ate up time that I could have spent polishing the site or adding new functionality, but that always happens in hackathons.

I ended up winning the Bigcommerce prize, and the VoiceBunny prize for best use of their respective technologies at AngelHack ATX. I’ve definitely got some hard-coding to take out, and some rough edges to polish off before the app is ready to go out to customers, but it’s a pretty good start for a 24 hour project.

Thanks to Mass Relevance for hosting the event, Damon, Wade, and the other organizers, the judges for spending their Sunday afternoon in a conference room, and to all the sponsors (TokBox, Amazon Kindle Fire, Bigcommerce, VoiceBunny, Elance) for making it happen!