Margaret LeibovicI'm an engineering manager at Mozilla. I love the open web, and I'm working on keeping it awesome.
http://blog.margaretleibovic.com/
Fri, 08 Jul 2016 08:19:52 -0400Fri, 08 Jul 2016 08:19:52 -0400Jekyll v2.5.3Leaving Mozilla<p>I first joined Mozilla as an intern in 2009, and after almost 6 years of working at Mozilla full time, I’ve decided it’s time for me to do something new. My last day will be Friday, July 15.</p>
<p>It amazes me to look back and think about how much I’ve grown since I joined as a junior developer years ago. I’m so thankful for the opportunities I’ve had to learn and grow at Mozilla, but more than anything, I value the friendships I’ve built with people around the world. Mozilla is full of talented people who truly care about making the web a better place. Mozilla’s mission is a challenging one, but it’s important work, especially as the web continues to evolve.</p>
<p>I haven’t decided what’s next for me, but I have no plans to leave Toronto. There’s a growing community of technologists and entrepreneurs here, and I’m excited to be a part of it!</p>
Fri, 08 Jul 2016 00:00:00 -0400http://blog.margaretleibovic.com/2016/07/08/leaving-mozilla.html
http://blog.margaretleibovic.com/2016/07/08/leaving-mozilla.htmlmozillaA Year in Management<p>It’s been a year since I became an engineering manager, and I’ve been thinking about what lessons I’ve learned. A year may sound like a short time, but it feels like ages. It’s hard to even remember what it was like to be an individual contributor on the team. I’ve developed a lot of new skills over the past year, but I think the best thing I’ve gained is a new perspective. </p>
<p>Managing a team and a project forces you to understand the whole process of shipping software, especially the role humans play. And shipping software, at least for the types of products I build, is mostly a human challenge.</p>
<h2 id="set-clear-expectations">Set clear expectations</h2>
<p>The easiest way to hold people accountable is to be upfront about what you expect from them. I often hear management platitudes like “give people room to fail”, but this plan doesn’t work if your team doesn’t know what constitutes failure or success. Failure is only valuable if people learn from it, and in order to learn, people must understand why something is a failure.</p>
<p>A common challenge for new (and old) managers is figuring out how to give people negative feedback, but if you’re clear about what you expect, it’s easier to deliver feedback directly and honestly. It takes work, but setting clear goals and objectives is what allows you to hold people accountable.</p>
<h2 id="repeat-repeat-repeat">Repeat, repeat, repeat</h2>
<p>To communicate a clear vision of what you want your team to achieve, you need to repeat yourself. And repeat yourself. You need to repeat yourself until what you have to say is predicable. It’s better for people to get tired of hearing you say the same thing, than to be surprised to learn they’re working on the wrong things. </p>
<p>Even if you deliver a message to the whole team, deliver it again individually. I’ve found weekly 1:1 meetings are a great time to refine my pitch, but also to improve it. Ideas are living things, and they evolve as you have conversations about them. Incorporating feedback from all the smart (and hopefully different) people on your team is one of the best ways to make those ideas grow stronger.</p>
<h2 id="nobody-knows-what-theyre-doing">Nobody knows what they’re doing</h2>
<p>The final big thing I’ve learned is that all the way up the org chart, nobody actually knows what they’re doing. This isn’t to say managers and executives are bad at their jobs, but rather that everyone is human. Every leader started out as someone like you, and probably still is someone like you.</p>
<p>Be the change you want to see. If you work in a healthy organization, your boss will appreciate it. If you do things well, you may even be promoted and end up as exactly one of those leaders who don’t have things all figured out.</p>
Wed, 04 May 2016 00:00:00 -0400http://blog.margaretleibovic.com/2016/05/04/a-year-in-management.html
http://blog.margaretleibovic.com/2016/05/04/a-year-in-management.htmlmozillamanagementFirefox for Android: Search Experiments<p>Search is a large part of mobile browser usage, so we (the Firefox for Android team) decided to experiment with ways to improve our search experience for users. As an initial goal, we decided to look into how we can make search faster. To explore this space, we&rsquo;re about to enable two new features in <a href="http://nightly.mozilla.org/">Nightly</a>: a search activity and a home screen widget.</p>
<p>Android allows apps to register to handle an &ldquo;assist&rdquo; intent, which is triggered by the swipe-up gesture on Nexus devices. We decided to hook into this intent to launch a quick, lightweight search experience for Firefox for Android users.</p>
<p><img alt="image" src="http://margaretleibovic.com/images/search/start.png" width="250"/> <img alt="image" src="http://margaretleibovic.com/images/search/suggestions.png" width="250"/></p>
<p>Right now we&rsquo;re using Yahoo! to power search suggestions and results, but we have <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1042943">patches in the works</a> to let users choose their own search engine. Tapping on results will launch users back into their normal Firefox for Android experience.</p>
<p>We also created a simple home screen widget to help users quickly launch this search activity even if they&rsquo;re not using a Nexus device. As a bonus, this widget also lets users quickly open a new tab in Firefox for Android.</p>
<p><img alt="image" src="http://margaretleibovic.com/images/search/results.png" width="250"/> <img alt="image" src="http://margaretleibovic.com/images/search/widget.png" width="250"/></p>
<p>We are still in the early phases of design and development, so be prepared to see changes as we iterate to improve this search experience. We have a few <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1042956">telemetry probes</a> in place to let us gather data on how people are using these new search features, but we&rsquo;d also love to hear your feedback!</p>
<p>You can find links to relevant bugs on our <a href="https://wiki.mozilla.org/Mobile/Projects/Search_activity">project wiki page</a>. As always, discussion about Firefox for Android development happens on the <a href="https://mail.mozilla.org/listinfo/mobile-firefox-dev">mobile-firefox-dev</a> mailing list and in #mobile on <a href="https://wiki.mozilla.org/IRC">IRC</a>. And we&rsquo;re always looking for new contributors if you&rsquo;d like to <a href="https://wiki.mozilla.org/Mobile/Get_Involved">get involved</a>!</p>
<p>Special shout-out to our awesome intern <a href="https://github.com/ericedens/">Eric</a> for leading the initial search activity development, as well as <a href="http://digdug2k.wordpress.com/">Wes</a> for implementing the home screen widget.</p>
Fri, 01 Aug 2014 17:10:00 -0400http://blog.margaretleibovic.com/2014/08/01/firefox-for-android-search-experiments.html
http://blog.margaretleibovic.com/2014/08/01/firefox-for-android-search-experiments.htmlmozillafirefoxandroidmobilesearchFirefox Hub Add-on Hackathon<p>For the past few months, the Firefox for Android team has been working on Firefox Hub, <a href="http://blog.margaretleibovic.com/2014/02/03/wip-home-page-customization-in-firefox-for.html-android">a project to make your home page more customizable and extensible</a>. At its core, this feature is a <a href="https://developer.mozilla.org/en-US/Add-ons/Firefox_for_Android/Firefox_Hub_Walkthrough">set of new APIs</a> that allows add-ons to add new content to the Firefox for Android home page.</p>
<p>These APIs are new in Firefox 30, but there are even more features available in Firefox 31, which is moving to <a href="http://www.mozilla.org/en-US/firefox/aurora/">Aurora</a> this week. As we&rsquo;ve been working on these APIs, we&rsquo;ve been building plenty of demo add-ons ourselves, but we&rsquo;re at the point where we want more developers to get involved!</p>
<p><img src="http://margaretleibovic.com/images/hub.png"/></p>
<p>Next week (May 5-9), we&rsquo;re holding a distributed add-on hackathon to encourage more people to start building things with these APIs, and I want to encourage anyone who&rsquo;s interested to participate!</p>
<p>This hackathon has three main goals:</p>
<ul><li>Find bugs with the APIs</li>
<li>Find bugs with the documentation</li>
<li>Start building a collection of awesome add-ons</li>
</ul><p>To kick off this hackathon, I made an <a href="https://mobile.etherpad.mozilla.org/hub-hackathon">etherpad</a> that links to documentation, example add-ons, and a <a href="https://mobile.etherpad.mozilla.org/52">long list of new add-on ideas</a>. Since our community lives all over the world, we&rsquo;ll hang out in #mobile on <a href="https://wiki.mozilla.org/IRC">irc.mozilla.org</a> to ask questions, report problems, and share progress on things we&rsquo;re making. In addition to building add-ons, you can also participate by testing new add-ons as they&rsquo;re made!</p>
<p>At the end of the week, everyone who participated in the hackathon will receive a special limited-edition open badge, as well as pride in <a href="https://wiki.mozilla.org/Mobile/Get_Involved">contributing to Firefox for Android</a>. And maybe I&rsquo;ll try to dig up some special prizes for anyone who makes a really cool add-on :)</p>
Wed, 30 Apr 2014 13:40:00 -0400http://blog.margaretleibovic.com/2014/04/30/firefox-hub-add-on-hackathon.html
http://blog.margaretleibovic.com/2014/04/30/firefox-hub-add-on-hackathon.htmlmozillafirefoxandroidmobileadd-onDare 2B Digital 2014: Remix the Web!<p><a href="http://www.dare2bdigitalconference.com/">Dare 2B Digital</a> is an annual South Bay conference that brings 300 young women ages 12-16 together to encourage them to consider STEM fields in college by coming together for a full day of inspiring talks and workshops showcasing women’s work and relevance in technology. For the past four conferences, <a href="https://twitter.com/lsblakk">Lukas</a> has signed Mozilla up as a sponsor and created a workshop that is run 3 times that day and reaches about 80-100 attendees. Last year, Lukas and I created a <a href="http://lukasblakk.com/creating-a-mozilla-workshop-for-beginner-hacking-of-mobile-html5-games/">workshop to teach these girls how to create mobile HTML5 games</a>. This year, Lukas couldn&rsquo;t make it to the conference because she was busy organizing <a href="http://lesbianswhotech.org/summit/hackathon/">another great outreach event</a>, so I volunteered to organize our workshop, and I recruited <a href="https://twitter.com/katiemthom">Katie</a> and <a href="https://twitter.com/harthvader">Heather</a> to help me.</p>
<p>I really love <a href="https://webmaker.org/">Webmaker</a>, a Mozilla project dedicated to helping people learn how to create amazing things on the web, so I decided to create a workshop to teach the girls how to use some of the Webmaker tools. My goal was to teach the girls how to use these tools to understand the basic building blocks of the web, as well as show them how easy it is to make their own web content. To prepare for the conference, I <a href="https://twitter.com/mleibovic/status/439130434551967744">gathered 20 loaner laptops</a>, ordered some swag, and remixed an existing Webmaker teaching kit to create an <a href="https://mleibovic.makes.org/thimble/remix">outline for the workshop</a>.</p>
<p>We started off each workshop with a brief overview of how the web works (Katie used her teacher skills to create some nice whiteboard diagrams), and then we jumped right into using the Webmaker tools. We started by walking the girls through using the <a href="https://goggles.webmaker.org/">X-Ray Goggles</a> to inspect webpages, and taught them that they can modify what they see in their browsers. We definitely heard lots of &ldquo;This is so cool!!!&rdquo; when we showed them how to change text and images on any webpage.</p>
<p>Once they felt comfortable with X-Ray Goggles, we pointed them to a gallery of <a href="https://goggles.webmaker.org/">existing Webmaker projects</a>, and showed them how to use <a href="https://thimble.webmaker.org/">Thimble</a> to remix those projects into their own. At this point, we let them loose to start <a href="https://twitter.com/mleibovic/status/439839669929246720">working on their own remixes</a>, and there was lots of enthusiasm and laughter as they started working on their own projects. We also felt thoroughly out of touch with youth culture when they started filling their projects with images of young male celebrities we had never even heard of.</p>
<p>Unfortunately, we only had an hour and 15 minutes for each workshop, which flew by, but we encouraged the girls to make their own Webmaker accounts to continue working on their remixes at home. They were definitely really excited to learn that all of these resources are available to them at home, and that they only need a web browser to get started!</p>
Mon, 03 Mar 2014 14:15:08 -0500http://blog.margaretleibovic.com/2014/03/03/dare-2b-digital-2014-remix-the-web.html
http://blog.margaretleibovic.com/2014/03/03/dare-2b-digital-2014-remix-the-web.htmlmozillateachwebmakerWIP: Home Page Customization in Firefox for Android<p>In Firefox 26, we released a <a href="https://blog.mozilla.org/blog/2013/12/10/new-home-screen-in-firefox-for-android-access-your-information-in-a-single-tap/">completely revamped version of the Firefox for Android Home screen</a>, creating a centralized place to find all of your stuff. While this is certainly awesome, we&rsquo;ve been working to make this new home screen customizable and extensible. Our goal is to give users control of what they see on their home screen, including interesting new content provided by add-ons. For the past two months, we&rsquo;ve been making <a href="https://wiki.mozilla.org/Mobile/Projects/Third-party_service_integration_MVP">steady progress</a> laying the ground work for this feature, but last week the team got together in San Francisco to bring all the pieces together for the first time.</p>
<p>Firefox for Android has a native Java UI that&rsquo;s partially driven by JavaScript logic behind the scenes. To allow JavaScript add-ons to make their own home page panels, we came up with two sets of APIs for storing and displaying data:</p>
<ul><li><a href="http://hg.mozilla.org/mozilla-central/file/tip/mobile/android/modules/HomeProvider.jsm">HomeProvider.jsm</a> holds basic data storage APIs, which allow add-ons to save data to specific datasets.</li>
<li><a href="http://hg.mozilla.org/mozilla-central/file/tip/mobile/android/modules/Home.jsm">Home.jsm</a> contains new APIs to add new panels to the home page, including specifying which kinds of views to make in these panels, and which datasets should back those views.</li>
</ul><p><img alt="image" src="http://margaretleibovic.com/images/home/grid.png"/></p>
<p>During the first half of our hack week, we agreed on a working first version of these APIs, and we hooked up our native Java UI to HomeProvider data stored from JS. After that, we started to dig into the bugs necessary to flesh out a first version of this feature.</p>
<ul><li><a href="https://twitter.com/liucheia">Chenxia</a> recently landed a new page in settings to allow users to manage their home panels, and she has been working on a patch to allow them to install new panels from this settings page (<a href="http://bugzil.la/942878">bug 942878</a>).</li>
<li><a href="https://twitter.com/lucasratmundo">Lucas</a> has been working on a patch series to allow add-ons to auto-install new panels to about:home (<a href="http://bugzil.la/964375">bug 964375</a>). He also has patches to add images to dynamic views using the Picasso image loading library (<a href="http://bugzil.la/963046">bug 963046</a>).</li>
<li><a href="http://www.linkedin.com/in/sogunsakin">Sola</a> (one of our awesome interns), added support for a gallery view layout in dynamic panels (<a href="http://bugzil.la/942889">bug 942889</a>).</li>
<li><a href="https://twitter.com/joshdover">Josh</a> (our other awesome intern), is working to support folder views in dynamic panels, similar to our built-in bookmarks panel (<a href="http://bugzil.la/942295">bug 942295</a>), and he also added support for handling clicks on these dynamic views (<a href="http://bugzil.la/963721">bug 963721</a>).</li>
<li><a href="https://twitter.com/michaelcomella">Michael</a> has been working on an <a href="https://github.com/mcomella/fennec_rss/tree/list_integration">RSS add-on</a> to demo (and dogfood) these new APIs.</li>
<li>I&rsquo;ve also started exploring how add-ons will authenticate users (<a href="http://bugzil.la/942281">bug 942281</a>), as well as ways to help them sync data in a battery/storage/network-friendly way (<a href="http://bugzil.la/964447">bug 964447</a>).</li>
</ul><p><img alt="image" src="http://margaretleibovic.com/images/home/rss.png" width="300"/></p>
<p>Many of these patches are still waiting to land, so unfortunately there&rsquo;s nothing to show in Nightly yet. But stay tuned, exciting things are coming soon!</p>
Mon, 03 Feb 2014 22:45:00 -0500http://blog.margaretleibovic.com/2014/02/03/wip-home-page-customization-in-firefox-for.html
http://blog.margaretleibovic.com/2014/02/03/wip-home-page-customization-in-firefox-for.htmlmozillafirefoxandroidmobileadd-onMozFest Recap: Building Your First Mobile Web App<p>This past weekend I attended <a href="http://mozillafestival.org/">Mozilla Festival</a> in London, and it was incredibly energizing! Everyone at MozFest was so excited about the web, but unlike your average tech conference, there was a much more diverse set of participants, including hackers, makers, journalists, educators, and even lots of kids. The focus of this year&rsquo;s MozFest was about creating a web-literate world, so I decided to facilitate a session on building your first mobile web app.</p>
<p>Although projects like <a href="https://webmaker.org">Webmaker</a> and <a href="http://appmaker.mozillalabs.com/">Appmaker</a> are designed to make content creation more accessible for everyone, I wanted to create some learning materials that could put people on the path towards becoming more serious web developers. This path includes learning the fundamentals of HTML/CSS/JS, as well as how to use the developer tools built into browsers, and popular collaboration tools like <a href="https://github.com/">Github</a>.</p>
<p>To teach these basics, I made a <a href="http://leibovic.github.io/first-web-app/">slide deck</a> that walks you through building a <a href="https://github.com/leibovic/stopwatch/">simple stopwatch app</a> that&rsquo;s hosted using <a href="http://blog.margaretleibovic.com/2013/02/05/hacking-firefox-os-apps-with-github-pages.html">Github pages</a>. At the start of my session, I presented these slides (and of course threw in some Firefox dev tools demos!), but then I let everyone loose to start hacking at their own speeds. There were about 25 participants with a wide range of ability levels, and I think this format worked well to keep everyone engaged (and gave me the opportunity to offer more individual help).</p>
<p>My hope is that other people might find these resources useful, so please use them and share them! Also, because they&rsquo;re open source, pull requests are welcome :)</p>
Tue, 29 Oct 2013 16:27:38 -0400http://blog.margaretleibovic.com/2013/10/29/mozfest-recap-building-your-first-mobile-web-app.html
http://blog.margaretleibovic.com/2013/10/29/mozfest-recap-building-your-first-mobile-web-app.htmlmozillamobileappsteachRemote Developer Tools and Firefox for Android<p>A lot of the Firefox for Android UI is written in Java, but under the hood there&rsquo;s still quite a bit of JS that controls core browser logic. We also use HTML to create the content of most of our chrome-privileged pages, such as about:addons. Today I found myself working on a polish bug for <a href="http://hg.mozilla.org/mozilla-central/file/tip/mobile/android/chrome/content/aboutApps.xhtml">about:apps</a>. In the past, tweaking the CSS for these pages has been a pain, since testing changes required pushing a new APK to your device. However, I remembered that the remote inspector recently landed for Firefox 26, so I decided to try it out. Verdict: it was amazing!</p>
<p><img alt="image" src="http://margaretleibovic.com/images/about-apps-inspector.png"/><img alt="image" src="http://margaretleibovic.com/images/about-apps-highlight.png"/></p>
<p>Setting up the remote developer tools is as easy as flipping prefs on desktop and mobile (these prefs are now exposed in the UI!), running an adb command to set up port forwarding, and hitting a button. The directions are <a href="https://developer.mozilla.org/en-US/docs/Tools/Remote_Debugging">really well documented on MDN</a>, so you should look there for more detailed instructions.</p>
<p>While playing around with the inspector, I also realized that remote chrome debugging is enabled for Firefox for Android. It wasn&rsquo;t immediately obvious to me that in order to attach the debugger to the main chrome window, you need to select the &ldquo;Main Process&rdquo; link on the desktop &ldquo;Connect to remote device page&rdquo;, but once I did that, I had access to all of the browser chrome JS. And since <a href="https://developer.mozilla.org/en-US/docs/Extensions/Mobile">add-ons for Firefox for Android</a> are written in JS, this means that you can easily debug all of <a href="https://github.com/leibovic/promo-banner/blob/master/bootstrap.js">your add-on code</a>!</p>
<p><img alt="image" src="http://margaretleibovic.com/images/addon-debugging.png"/></p>
<p>Big thanks to the Firefox Developer Tools Team for doing so much awesome work. And I know they&rsquo;re always <a href="https://wiki.mozilla.org/DevTools/GetInvolved">looking for new contributors</a> to help them out!</p>
Tue, 15 Oct 2013 00:42:00 -0400http://blog.margaretleibovic.com/2013/10/15/remote-developer-tools-and-firefox-for-android.html
http://blog.margaretleibovic.com/2013/10/15/remote-developer-tools-and-firefox-for-android.htmlmobiledeveloper toolsfennecfirefoxadd-onmozillaHome Page Snippets for Firefox for Android<p>Have you ever noticed the messages that appear under the search box on desktop Firefox&rsquo;s home page? We call these messages <a href="https://wiki.mozilla.org/Websites/Snippets">snippets</a>, and they&rsquo;re dynamically created from web content hosted by Mozilla. These snippets provide an easy way to communicate with desktop users, but right now there&rsquo;s no equivalent feature for Firefox for Android.<br/><br/>Since we first released the native version of Firefox for Android, we&rsquo;ve included a hard-coded promotional banner as part of our home page &ndash; you&rsquo;re probably seen it encourage you to set up Firefox Sync. However, we&rsquo;ve been working on a <a href="http://lucasr.org/2013/08/21/revamped-ui-in-firefox-for-android/">complete rewrite of the home page</a> for Firefox 26 (exciting!), and we&rsquo;re taking the opportunity to replace this with a new customizable banner.<br/><br/>Because this banner is part of our native Java UI, we can&rsquo;t just load web content the way desktop does. Instead, we decided to build a JS API to let add-ons customize it. We came up with a simple API that lets developers add and remove items from a set of messages that rotates through this banner. Right now, these messages just consist of an icon, some text, and a click handler. We put this banner API in a new <a href="https://developer.mozilla.org/en-US/docs/Extensions/Mobile/API/Home.jsm">Home.jsm</a> module, since we have plans to add more home page customization APIs to this module in the future!<br/><br/>As a demo, <a href="https://github.com/leibovic/promo-banner">I made an add-on</a> that fetches data from a <a href="https://github.com/leibovic/snippets-server">basic snippets server</a>, and turns that data into messages that are added to the home banner. This server currently serves data from the 5 most recent <a href="https://twitter.com/FennecNightly"> @FennecNightly</a> tweets, which is actually pretty relevant to Nightly users. If you&rsquo;re using <a href="http://nightly.mozilla.org/">Nightly</a>, I&rsquo;d encourage you to <a href="http://people.mozilla.org/~mleibovic/promobanner.xpi">try it out</a>, and as always, please <a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox%20for%20Android">file any bugs</a> you find!</p>
<p><img src="http://margaretleibovic.com/images/promo-banner.png"/></p>
Thu, 26 Sep 2013 21:05:54 -0400http://blog.margaretleibovic.com/2013/09/26/home-page-snippets-for-firefox-for-android.html
http://blog.margaretleibovic.com/2013/09/26/home-page-snippets-for-firefox-for-android.htmlmozillamobileadd-onfennecandroidReader Mode Improvements in Firefox 24<p><a href="https://play.google.com/store/apps/details?id=org.mozilla.firefox">Firefox 24</a> was released today! Along with <a href="https://www.mozilla.org/en-US/mobile/24.0/releasenotes/">a lot of other great features</a>, this release includes a bunch of improvements to <a href="http://lucasr.org/2012/09/03/reader-mode-in-firefox-beta-for-android/">Reader Mode</a>. The most noticeable improvements are a polished options menu and a &ldquo;Night Mode&rdquo; that automatically changes the background/text colors depending on ambient light levels. However, many other small bugs were fixed in the process, increasing the quality of this feature.</p>
<p>I&rsquo;m making this post because I want to highlight that <strong>over half of the bugs </strong>fixed for these Reader Mode improvements were fixed by <strong>volunteers</strong>! I want to thank the 7 volunteers who fixed these <a href="https://bugzilla.mozilla.org/buglist.cgi?quicksearch=784387%2C789980%2C876187%2C871524%2C862445%2C800899%2C828325%2C802093%2C872003%2C875852%2C867875%2C868936&amp;list_id=7932528">12 Reader Mode bugs</a>. You all rock!</p>
<p><img src="http://margaretleibovic.com/images/reader-mode.png"/></p>
Tue, 17 Sep 2013 17:10:10 -0400http://blog.margaretleibovic.com/2013/09/17/reader-mode-improvements-in-firefox-24.html
http://blog.margaretleibovic.com/2013/09/17/reader-mode-improvements-in-firefox-24.htmlmozillafennecfirefoxcontributereader