Meetup Hacks: Introducing Meetloaf!
Each quarter, Meetup holds a two-day internal hackathon. Engineers work on hacks ranging from launchable features, to internal tools, to the downright ridiculous. Meetup Hacks is a new feature focusing on these projects.
Caroline is a Core Software Engineer who recently graduated from Tufts University. When she’s not hacking, she listens to last.fm while working on Meetup notifications.
Being new on the job and wanting to contribute with something practical, I was all set to build something that might actually get pushed to production. I spent the week before the hackathon tossing around a lot of ideas, mostly relating to a big project I’m about to start.
Then, as I was sitting at my desk blasting some tunes and hunkering down on a tough bug, an incredibly random idea for a project came to me: what if I allowed our members to hook up to their last.fm accounts?
I’m the kind of person who loves data, and loves music, so when it comes to a combination of those two things, I swoon, just a little. I put feelers out into our dev hipchat channel to see if there were any other last.fm users around so that I could possibly justify doing this hack, but I only got two responses. Turns out, most people ditched last.fm a few years ago.
But, the more I talked to my friends about it, the more I wanted to do it. It’d be something fun and I’d get to learn about the authentication process.
And come, on what’s better than music?
When we got around to presenting our ideas at the hackathon kickoff, it turned out that two of our Data Team engineers (Brian and Evan) had a similar idea. But, they wanted to use the Facebook “Like” data that we have from some of our members to generate a concept of the music taste profile for a group. At that point, I was pretty set on last.fm, so we decided to get together at the end of day 1 and see what we could do about combining our projects.
So, then it was time for me to dig into the last.fm api. I explored a little bit and implemented calls to a few of the artist specific methods just to get comfortable before diving into user auth.
While the api is great on the whole, the one thing that might be frustrating to some developers is that they’ve developed their own authentication system. It’s incredibly similar to OAuth, but not enough so that I could use the framework that Meetup already has for linking to OAuth services like LinkedIn and Facebook. Some would groan, but I know next to nothing about authentication protocols, so I took this as an opportunity to get familiar with them.
There are a few different ways to authenticate with last.fm, but I chose the desktop application route so that I wouldn’t have to allow last.fm to make calls to our development environment. From there, it’s a relatively simple process: you get a token from last.fm, have the user request authorization using that token, and then you can fetch a session (and corresponding key) with last.fm. The somewhat difficult part comes from deciding how to store intermediary data (like the token) and how to proceed through all the stages I mentioned.
Because this was a hackathon, I took the hacky way out, and passed the token through the whole process, and kept track of the user’s state by monitoring the window I had opened for them to authenticate with last.fm (so that I would know when to trigger a request for a session key). Kids, don’t try this in production.
Despite all the hackiness, I got to learn something: for the first time, I got to play with our internal Ajax method library in the process to make the links between what was happening in the browser and storing the account tie in the DB.
Once I had authentication, I could actually start doing fun things with user data. As per Murphy’s law, the api call I was hoping to use was deprecated, and ended doing a bunch of fun set operations to develop a playlist for a meetup group based of the last.fm stylings of anyone authenticated in that group. Everything was fine and dandy, until I realized that I only had two Meetup HQers authenticated, and didn’t have enough data to make good playlists.
Luckily, Brian and Evan, who were working on the facebook side of things, let me dig into some of what they had built and I got to embark on the process of using the echonest api to convert between facebook’s identifier and musicbrainz ids, which is what last.fm uses. So, after all this work, anyone authenticated with last.fm could click a button to create a last.fm playlist for any group they were in.
Finally, I got together with Brian and Evan to set up the beautiful integration of our projects. They had pulled all the facebook info and associated pairs of meetup groups and music artists with a numeric score. I supplied them with a way to look up the music taste for a member (since last.fm is more detailed than facebook on a per member basis), and Evan adjusted his beautiful group recommendation algorithm to recommend meetup groups to a member based on their music preferences. While the recommended groups were not ones that I might be interested in, it definitely knew me. I got recommended a couple Meetups in Urbana, Illinois (thanks, Elsinore), and though I was unaware that my music taste so heavily reflected my gender, I was recommended a lot of female focused groups.
While I was right in my assessment that this is not going to make it into production, I had a great time, got to know some other MEME teamers a little bit better, and most importantly, I now have a playlist on last.fm reflecting our collective music taste.
Special thanks to the guys for coming up with the ultimate name for the ultimate project: Meetloaf.
Introducing Attendance on Mobile Web!
Each year, we invite exceptional Computer Science students to intern at Meetup. They work on product teams alongside full time engineers, as well as complete an end-to-end project related to the Meetup platform. This year, our interns tackled a feature our members have been asking for: an attendance tool on mobile web.
Casey Caruso, UI Engineering intern and rising Senior at Lehigh University
Emily Eng, UI Engineering Intern and rising Senior at Tufts University
Selecting a project:
While brainstorming ideas for our summer intern project, it was important to us that we implement a feature that would truly improve members’ experience with Meetup. We looked closer at the role of Meetup organizers and reevaluated the tools we were giving them to manage their Meetups. In doing so, we discussed the reality that many organizers are interested in tracking member attendance. Taking attendance allows them to distinguish loyal members, lets them better anticipate the turnout at future Meetups, and enables them to run a more successful Meetup group overall. Although Meetup had an attendance management tool on desktop, there was no mobile web feature, leaving organizers unable to take attendance on their phones at the most sensible time: as people walk in to their Meetup. We wanted to provide organizers with the ability to take attendance conveniently on-site of a Meetup on their mobile devices. Out of all the ideas that came out of our brainstorm, this was a clear winner since a mobile attendance tool is a feature that organizers have specifically requested in the past.
The Development Process
The initial design of the mobile attendance tool was simple. It had a list of members with corresponding checkboxes, the members being anyone who had RSVP’d yes to the Meetup, and above the list was the current count of how many people were marked as attended. In the nav bar, there was an X button on the left to return to the event page and a magnifying glass icon on the right that revealed a search bar so that organizers could search for a member in their group if he or she showed up to the Meetup without RSVPing.
A technical challenge that we faced while building this tool was making sure that we were coding smartly, reusing existing code where possible. So, for the search portion of the attendance tool, we decided it would be a good idea to reuse some of the code that had already been implemented for the search tool in Messages. This task involved factoring out a generic search view from the existing Messages search plugin and making it able to be used anywhere on the Meetup site. As a result, this generic search tool will also be able to replace a bunch of places where we have been using jQuery UI Autocomplete.
After finishing the first version of the project, we ran it through usability testing to see what we could improve. Interestingly, we found that some organizers were confused about the permanence of their actions on the page. To make the actions more clear, we decided that it would be a good idea to pivot from our initial design. Instead of updating a member’s attendance in our database on click of a member’s corresponding checkbox, it would be better to include an explicit “Save” button in the nav bar. This way, if organizers were just curious to see what the attendance tool was, they could poke around without the fear of inadvertently changing their Meetup’s attendance. Additionally, we saw that some organizers did not understand what the magnifying glass search icon meant. To address this problem, we moved the search bar out of the nav bar and, instead, placed it right above the attendance count. We also added “Mark All” and “Unmark All” buttons to make taking attendance easier for organizers of larger groups. Some additional features that are currently in the works for version 2 are ways to mark members as “no-shows” and ways to mark members’ payment statuses.
The Final Product
Overall, working on this intern project was great; it was both fun and challenging, and we have definitely learned a lot from it. Many thanks to everyone who helped us along the way, and we hope that Meetup organizers will enjoy this new feature!
Interested in interning at Meetup? Contact recruitment at firstname.lastname@example.org
Who’s Making Meetup? Vlad Burca - Software Engineer
Vlad is one of Meetup’s newest makers. After graduating from Trinity College in June, he joined the Core Engineering team.
Did you have any experience with Meetup prior to applying?
My experience with Meetup started during the summer before I applied. I used it a couple of times - once in NYC, where I attended a hackathon at a tech company, and once in San Francisco, where I attended a social event for meeting other international travelers!
You made the decision to work for Meetup in November and didn’t start here until June. What was that waiting process like?
The waiting process was tough, mainly because I wanted to graduate and start my career at Meetup sooner! Throughout this period, my recruiter kept me updated with really useful information and I even got some Meetup swag from her! All of this kept my enthusiasm alive.
You’ve been here for a few weeks now. What’s it like being a new member of the team?
Challenging and exciting. Challenging, because I am trying to get up to speed as fast as I can with all the technologies behind Meetup and exciting, because once I gain more experience, I will be able to make meaningful contributions to the product! Throughout this process, my mentor and manager were really helpful, guiding me with help and support when I need it. My product team was also very warm and welcoming; as a result, I think I integrated myself pretty fast!
An experience that really made me connect with co-workers was the Meetup crawl. We picked several meetups around NYC and visited them, trying to find out more about their background and understand the purpose of those groups. It was a very fun, team-bonding experience through which I got to know more about the people that rely on Meetup to create communities.
What are you working on?
I am on the Communications and Connections (CoCo) team, also known as the Talk Team. I am excited about working on challenging problems and on products that would facilitate the way people communicate and interact with each other. This is mainly what we do on the Talk Team. The results of our work will come to life in the following months and I really hope that it will improve the general user experience within Meetup.
The engineering challenges that I faced so far are related to the big code base of Meetup. It just takes a while to get used and to understand the major parts of the code and also to learn all the technologies being used to implement various features of Meetup. I’ve made a lot of progress on that since I started, but there is so much more to learn! And that’s what makes it exciting for me.
Other engineering challenges that I’ve been drawn to were related to security issues, especially since I am on a team that works on communication products between users. My team is highly concerned about the privacy of our user data and of the user interactions. We want to maintain a very high standard of trust. Sometimes this creates new engineering challenges but I am excited to work on these and come up with solutions that would solve them!
What’s the best part of working at Meetup?
For me, it’s definitely the very tight community within the company. Not only that the product we are developing is empowering communities, but even by working for Meetup I feel that I am part of a strong community. Everyone is helping each other, from technical problems to more office-related ones. I can’t neglect the other parts of the Meetup community that I love: the weekly Eatups, which are our company-wide lunches where I get to eat alongside with those whom I do not work directly with on a daily basis. And the amazing MeatupstairsBBQ, our weekly barbecue, is another great opportunity to get to know co-workers better while enjoying awesome views of the NYC skyline.
Overall, I am really happy and thankful that I am part of the Meetup community and I want to contribute to it at my full potential!