Smashing Conference Barcelona

Hung Nguyen

Please note all photos are taken by me unless otherwise stated.

During the last week of October, I was fortunate enough to attend the Smashing Conference in the beautiful city of Barcelona, Spain. The conference was held at the breathtaking venue, Palau de la Música Catalana and covered a wide range of design topics ranging from the more practical to the truly inspirational.

In this blog post, I would like to share some the highlights.

Event Highlights

Before getting into the talks, I wanted to share with you the fantastic job the organizers did with the event.

The Venue

I honestly can’t say this enough but everything about the Palau de la Música Catalana was absolutely stunning. The building is rich in history and I constantly found myself getting lost in the details during the talks.

Even with so many architectural moments, the one that stood out the most for me was the skylight situated in the center of the concert hall. This was simply mesmerizing to behold with how intricate the design was. This is definitely something I will never forget.

Barcelona_2015-3 Barcelona_2015-5Barcelona_2015-7

The Fun Details

What fun is a design conference without a chocolate fountain? Yes, there was really a chocolate fountain there which was very popular with the attendees. Aside from the great selection of snacks, there was also a party held at the Estrella Brewery and a typography photo walk to cap off the conference.

Barcelona_2015-85 Barcelona_2015-74 Barcelona_2015-42


Talk Highlights

Although all the talks were great in their own way, two of them really resonated with me. Jina Bolton’s talk on “Living Design Systems” and Andrew Tider & Jeff Greenspan’s “We’ll teach you everything we don’t know”.

Living Design Systems

This talk hit especially close to home since it was directly related to working on Firefox OS. When creating an operating system, one of the biggest issues is maintaining consistency across all applications and components. A lot of the times. you’ll find graphical discrepancies because a specification wasn’t followed or there is simply a lack of documentation or support.

What the Jina and her team at Salesforce did was create a living design system that provided a cross platform approach to handling graphical components in a modular manner. This made updates to the design instant to all parties using it.

The talk provided some great examples and I hope to integrate some of it into the Firefox OS work being done. There so much more to it then what I’m sharing so please check out her blog post here for more info.

Barcelona_2015

We’ll teach you everything we don’t know

On the other end of the spectrum was a much more emotionally inspirational talk by Andrew Tider and Jeff Greenspan. These two designers turned activists created some of the most eye opening projects that help bring to light topics that were generally swept under the rug.

They spoke about their unconventional approach to tackling problems (which in many cases really paid off with a bit a drama) and to always traveling the road less taken.

You can check out their talk here.

Barcelona_2015-84


Closing

Overall the conference was a fantastic experience and I would highly recommend it to anyone who is interested.

Before I sigh off, I just wanted to say that if you ever get the opportunity to visit Barcelona, do not hesitate. It was truly a memorable experience that I will never forget.

Now I leave you with some of my favorite photos!

H.

Barcelona_2015-11 Barcelona_2015-13 Barcelona_2015-24 Barcelona_2015-45 Barcelona_2015-109 Barcelona_2015-111

My Adobe MAX adventure

Carol Huang

Hello from Taipei, I want to share with you my recent experience at a design conference. Being an a smallish island, Taiwan has limited design learning opportunities, but thanks to Mozilla’s training program I was able to attend the Adobe Max conference, in Los Angeles. It was a great experience to venture into a different culture and to meet designers from different fields at once.

Adobe MAX is a creativity conference held in Los Angeles in October 2015. More than 7,000 people from all over the world gather together. The conference runs for three full days. It’s like a designers’ candy land because it’s full with inspirational and iconic speakers (such as Maira Kalman, Baz Luhrmann, Elle Luna, Brandon Stanton), various sessions, labs, creative workshop and the MAX keynotes! This was my first time attending this design conference. I was super excited to join the conference where I can learn about new products, technology and industry trends.

One of the keynote’s major announcement was the debut of Adobe’s new user experience and user interface design application, currently being developed under the codename Project Comet. It allows you to design and build interactive prototypes in a vector environment. It lets you takes your UX designs from start to finish with the cross-platform app — wireframing, visual design, interaction design, prototyping, previewing and sharing. As a UX designer, one of our challenges right now is that we’re looking for a easy-to-use tool to create prototypes in order to do user testings. Then we can tweak our design and repeat the process. One of Project Comet’s features is that it could import, repeat, and mask multiple images in a single step. This feature would really help us reduce the repetitive and time-consuming work needed to build the prototype so, we could have more time to refine our design. After watching Project Comet demo, I was really looking forward to the actual product. It’s very easy for designers to use and I was impressed by the performance and quality when they showed dozens of artboards in a single Project Comet document. If you’re interested in this project, you could sign up to their mailing list for the latest Project Comet updates.

At Adobe MAX 2015, Creative Sync was a common theme in many of the demos. Creative Sync is the technology that synchronizes assets saved to your Creative Cloud account, across many of the Adobe applications. The advantage is having the ability to store the assets in a central location so that designers can reuse them across our entire design project, which is a key benefit for us, a globally distributed team.

And for those that couldn’t be there, you can now watch MAX 2015 keynotes and conference sessions on demand here.

Overall, it was such a wonderful experience to see the graphic works made by the creatives from all over the world, meeting so many creatives and the inspiring speakers. It was exciting for me to be part of Adobe MAX. Collectively, they are bringing together the world’s best creativity, experience and product innovations.

Lastly, I want to share a quote from Baz Luhrmann when he gave his talk at Adobe MAX. I feel so lucky I get to see him in person in the conference. He is one of my favorite filmmaker who directed Romeo + Juliet (1996) and Moulin Rouge! (2001). Personally, I love the visual impact he brought to the audience in Romeo + Juliet. Luhrmann used his own style to tell a modern version of Shakespeare’s story. He attracts the audience with cinematic style with intense pace of the confrontation between two families with drastic soundtrack of contemporary music. I was fascinated by his unique way of storytelling.

Here’s his quote:

“Get it out! Make something! Don’t wait for permission!!”  ― Baz Luhrmann

 

My conference badge!

My conference badge!

LA convention center

Graphics made by Dave Kinsey.

Graphics made by Dave Kinsey.

Over 7000 creative minds gathering in LA.

Over 7000 creative minds gathering in LA.

image souce: Project Comet - Adobe

image souce: Project Comet – Adobe

Baz Luhrmann walked on to the stage.

Baz Luhrmann walked on to the stage.

A long journey: from partner to Mozillian

Victoria Gerchinhoren

Hi! I am Victoria, a UX Visual Designer who recently joined Mozilla to work on Firefox OS, with Patryk Adamczyk and the rest of the amazing UX team. But to be honest, it feels funny coming to the Toronto office for my first day at Mozilla, my “new hire” introductions went more like “Hi, how have you been doing since the all hands a few months ago?”

To tell you a bit of the story, I worked at Telefónica R&D for over 6.5 years where I had the chance to be involved in wide variety of projects from health to entertainment to communications services. Working in R&D ensured that all my projects were always exciting as they were on the cutting edge of technology. It’s the R&D side of Telefónica that made it possible to envision development of a web based mobile OS.

This resulted in working with Mozilla from a partner standpoint at the dawn of the FIrefox OS project. The story begins with Telefónica and Mozilla realizing that joining forces was wiser than duplicating effort in the challenging endeavour of creating a new mobile OS based on web technologies. This partnership benefited from the very best the each company had to offer, Mozilla’s knowledge of the open web and Telefónica’s knowledge of communication services.

Both companies respected the strengths of one another, allowing for a natural collaboration based on trust. The working environment allowed for our team to grow a strong bond even thought we were all spread out across the world.

Before I joined the project, the Telefónica UX team already began to set the core foundations of the navigation model and visual design, however it was clear that the task was too great for the small team we had. A decision was made to join the UX efforts, recruit more designers, and focus on one UX direction by joining the efforts of both UX teams (which cut the work load in half), even with this approach the first year of Firefox OS development was some of the more intense time of my life.

Forming the teams was a very interesting experience for all of us, working across different cultures, sharing knowledge, tools and processes between every imaginable time zone. We would gather every few months to enhance the inter-team collaboration before a major milestone in some of the world’s most exciting cities which happened to host our partners or company offices: Barcelona, Berlin, London, Oslo, Madrid, Mountain View, Paris, Portland, San Francisco, San Diego, Sao Paulo, Taipei, and Whistler. Getting to know each other in person, discussing the project face to face, sharing meals and a beer here and there were key for bonding, and helped the future conversations over Vidyo, Hangouts, Skype or even the Bugzilla.

Overtime as we shaped and improved our processes, meetings became a regular part of life: daily stand ups for the members of each team (systems front end or communications in my case) and weekly updates outlining the most important outcomes either by discipline (Q&A, UX team, Visual Design, Interaction Design, Front end, Back end, Product) or by component area. We would share our planning and milestones over the Mozilla’s wiki or Google docs. We would reach each other directly to sort out the day-to-day work and document all the implementation through Bugzilla, with frequent bug triage, as designers, we would review the implementation on the device and raise bugs if what they saw was not aligned with the proposed designs.

Mixing every imaginable culture, background and experiences helped us also understand how different people work and perceive things, it is by far the most interesting and diverse team I have worked with.

I have never thought I would be living with a project for so long, but an OS is like a child, you see it being born and then you are there to guide it in its development. Release after release we have improved our ways to make it better.

I am here to continue the evolution of Firefox OS, now just from another side.

I would love to hear from you all. Reach out to me through the following channels, I am always happy to chat!

 

IRC: vicky_

skype @vixvixy

email: vgerchinhoren@mozilla.com

And now for some photos from the early days…

Firefox OS Emoji

Patryk Adamczyk

In Spring of 2014, we embarked on the Firefox Emoji project with the main purpose to add a little more whimsy into the Firefox OS Messaging (SMS/MMS) app and we wanted to give the community more choice when it came to free, high quality yet open source emojis.

The project was perfect for our freelance illustrator, Sabrina Smelko. The art direction focused on creating a sense of familiarity to our users while maintaining a style that speaks to our brand, Mozilla. At first we thought about using a single mascot (perhaps the fox) for all the smileys, human and animal figures but in the end we believed that focusing on creating distinction in shape (silhouettes), colour and form among the different emojis was more important due to the potential of limitless types of emojis to be added to the spec.

Our final set includes two types of character designs; one for the emotions in the form of smileys, the other one for everything else in the form of real world human figures and animals.

The smileys use a flatter shading reflecting the Firefox OS visual design. However we departed from the expected all yellow colour scheme as we wanted to accentuate certain feelings and moods further with unique colour.

The figures are based off the smiley but with more subtle facial features while still maintaining the fun, casual and approachable feel already established. These themes are carried onto the animal figures like the cat (now the fox) and monkey, drawn with large facial features similar to the smileys. We kept racial diversity in mind, and have designed all our emojis using SVG, allowing for skin tone modifiers to be applied in an upcoming release.

We are hoping this first set of emojis (Unicode 6.0 spec) will land in the next release of Firefox OS thanks to the hard development work of Pavel Ivanov and Reza Akhavan as well as the support of our visual designer Amy Lee and our font guru Jonathan Kew.

A Selection of the Emojis

emoji

Task Continuity Part 2: Taiwan and Japan

Bill Selman

Research and blog post by Bill Selman and Gemma Petrie.
(If you haven’t read our previous report on Task Continuity, we recommend reading it first for context.)

Screenshot 2015-07-09 15.31.18

Last time we wrote on this topic, we shared our observations and results from our research into multi-device workflows and task continuity in the United States. As we reported then, our participants are using the tools they have at-hand to construct larger workflows. The most popular of those tools being screenshots, SMS, and email.

Unlike most other markets that charge per SMS, the US has a unique mobile services pricing structure that often includes almost unlimited SMS in a monthly service fee. In other regions of the world, SMS has been replaced by communication tools like messaging apps (such as Whatsapp). In contrast, messaging apps have lower penetration in the US (for example, Whatsapp has 8% penetration in the US compared to say 69% in India). While the overall usage of SMS is declining even in the US, SMS is still a lower cost and accessible task continuity strategy here.

The question is: how are users in other regions using different tools for task continuity? And if they are replacing SMS with Messaging apps, how they are employing other task continuity strategies differently?

Since Firefox is a global product, we believe it’s important to meet the needs of all of our users. To that end, we organized a similar field study to our US project, but in two more economically advanced east Asian markets: Japan and Taiwan.

Research Questions and Methodology

In order to compare and contrast, we followed the same research methodology that we employed in our previous study of task continuity in the US. The primary difference in our field work and analysis was an emphasis on the question of how region and culture affect users’ task continuity strategies.

We interviewed 5 participant groups in and around Taipei, Taiwan and 5 participant groups in and around Tokyo and Yokohama, Japan. In total, we interviewed 13 participants. All 10 interviews took place in the participants’ homes. In addition to our primary research questions, the semi-structured interviews explored daily life, devices, and integration points. Further, participants provided home tours and engaged in multi-device workflow future thinking exercises.
Screenshot 2015-07-10 12.17.31

Results

Taiwan and Japan

  • As we hypothesized, messaging apps have a strong role in task continuity in Taiwan and Japan. Every participant we interviewed used the messaging app LINE frequently to communicate with friends, family, and work associates as well as to continue tasks.
    • LINE allows users to set up specific groups of contacts called “communities” that can be messaged simultaneously. Participants used this feature to share and negotiate tasks and information.
    • LINE has replaced other communication and continuity channels such as SMS and email. SMS is viewed as “outdated.”
  • With the exception of photos, data and task continuity appears to be less precious among the participants we interviewed than in the US. Almost no participant mentioned alarm about the possibility of losing data or not being able to reconstruct a task.
  • Participants in both markets appeared to have shorter recovery horizons overall; in other words, most task continuity was for items for later that day or week. Bookmarks were used for longer, more persistent recovery horizons, but use was more for frequently visited sites.
  • Both Taiwan and Japan appear to be instructional cultures. In public places, visual instructions were present. Some participants mentioned that they were not aware how to use some tools well but also believed that they were missing out by not using them. For example, TOK2 said, “I’m not good at Evernote. I wish I could become better at Evernote.”
  • Compared to the US, we observed more device specificity among participants.
  • Yahoo! remains a popular starting point for browsing in both markets.

Taiwan

  • For our participants who were not information workers, email as a communication tool has been replaced by LINE or Facebook. Email is now used primarily as an identity tool to manage accounts for shopping or services such as banking.
  • With the exception of the software engineer, participants expressed little knowledge of device-to-device sharing (except for transferring music) or continuity. For example, browser syncing across devices currently enjoys no usage among all but one of our participants.
  • With the exception of a software engineer, cloud services were not used frequently among our participants as task continuity or storage tools. Participants were either not aware of cloud storage as a service or had a strong distrust of the security and privacy of cloud services (based on recent highly publicized hacking incidents).
Device Ecosystem in Taiwan

Device Ecosystem in Taiwan

Japan

  • High fragmentation of devices with limited task continuity. Fragmentation extends to services and strategies. For example, every participant had a different email address for each device. We speculate this fragmentation stems from:
    • A cultural separation between work and personal life.
    • An operator policy that supplies an email addresses to each smartphone account.
    • A culture that favors physical media and tangible objects. (e.g., many activities are still paper-based, none of the participants used streaming services and continue to buy or rent CDs and DVDs).
  • Due to the high fragmentation of devices, only TOK5 used cloud services; even he said that he was an outlier in this regard at his office.
  • Google search is used as a primary search engine and some participants had Gmail accounts, but other Google services such as Drive appear to have less penetration.
Screenshot 2015-08-21 15.45.29

Device Ecosystem in Japan Demonstrating Device Fragmentation

Task Continuity Model

Updated Task Continuity Model.

Updated Task Continuity Model.

Our research in Japan and Taiwan led us to expand the Hold/Push stage of the task continuity cycle we developed based on the US research. In Japan and Taiwan (but also to some extent in the US), we observed that when participants shared data or a task, the sharing was accompanied by a social negotiation. That is, participants used some communication platform to discuss how to recover the task.

For example, TAI4 described an instance of this process: When planning a vacation with family, he or his wife send links to a LINE family group for suggested destinations and dates. The family members discuss the destination or alternatives via LINE. Once a destination is agreed upon, the task is resumed by reserving the destination or including it in the travel itinerary.

Example of Hold/Push Sharing Negotiation

Example of Hold/Push Sharing Negotiation

Task Continuity: Similarities to the US

We observed the following similarities when comparing our participant groups’ task continuity strategies in Taiwan/Japan to our groups’ strategies in the US.

  • Ad Hoc & Personal: Many participants were not knowledge workers and did not have access to tools or skills for more “traditional” workflows.
  • Satisficed Solutions: Participants are relatively happy with their task continuity systems, but aware that better solutions likely exist.
  • Smartphones: Smartphones were the dominant device in most task continuity ecosystems.
  • Common Strategies: In all three countries, email, cloud storage, phone calls, and bookmarks were popular task continuity strategies.
  • Password Management: Recalling logins and passwords is a challenge. Most of our participants stored passwords on paper or locally in a spreadsheet or digital notepad. In all three countries, most participants re-used the same passwords or used a personal system to create password patterns.
  • Device Continuity: Some multi-device continuity is being achieved through iCloud and Chrome (though this was less common in Taiwan and Japan).
  • Sharing is Saving: Many “sharing” services like email and texting have been repurposed for saving functions.

Task Continuity: Differences to the US

We observed the following differences when comparing our participant groups’ task continuity strategies in Taiwan/Japan to our groups’ strategies in the US.

  • Primary Strategies: LINE, email, and bookmarks were the primary task continuity strategies in Taiwan and Japan.
  • Screenshots: Screenshots were not as prevalent as a task continuity strategy among our participants in Taiwan, and even less so in Japan.
  • Cloud Storage: While cloud storage was a known service in both Taiwan and Japan, few of our participants used cloud storage and several said they had stopped using cloud services due to widely publicized security concerns–specifically, the Sony data breach and the hacking of celebrity iCloud accounts.
  • Email: Email was a popular task continuity strategy in both Taiwan and Japan, but participants appeared to be less concerned about adding metadata for future search retrieval and communication tasks had primarily moved to LINE.
  • Streaming: In Japan, most of our participants still rented physical music (CDs) rather than use streaming services.
  • Bookmarks: Bookmarks were a more popular task continuity tool among our participants in both Taiwan and Japan than in the United States. In one Taiwanese household, bookmarks on the family PC were used as a means of collaboration for planning future events.
  • Not Automatic: Unlike the United States, there was less of an expectation that organization should be automatic.

Observations

Based on our two studies, we learned that the content of task continuity strategies varies a good deal among different markets. Participants adopt technologies that are prevalent among their peers, easily accessible, and are cost-effective. These qualities for different technologies vary greatly. However, ultimately, with the adjustments to our task continuity model, the form of task continuity is strikingly similar among different markets.

The main difference we observed when comparing Japan and Taiwan to the U.S. was the presence of a greater degree of more complex social negotiation (in terms of the number of participants). Since LINE places emphasis on communities in the user experience compared to groups in SMS messaging apps, the more extensive negotiation could be attributable to the prevalence of LINE in Asia.

While the form may be the same for task continuity, the differences in context and content are important to consider when building task continuity actions and activities into technology. As is the case with most technology, end-users use tools and functionality differently than designers and engineers anticipate. Thinking on these studies, it is remarkable how many participants used tools designed to share data as a means to save data for themselves or for later. Designers and engineers must consider how to adapt their multi-device task flows to incorporate actions not just for one-off sharing but for persistence and negotiation with others.