A ubiquitous aspect of all design projects is collaboration. Here at zipBoard, we are building a tool to make collaboration easier. To better understand the process of collaboration, we like to explore the design challenges, practices and workflows that are at the core of it.

Collaboration between designers, developers and creatives, as well as collaboration between agencies and clients. One of the best way to get up to speed on all these aspects is by understanding the workings of a product studio, and to do this we spoke to

Linnéa Strid

, a UX designer with

Apegroup

, who helped us get an insight into how their company functions.

Apegroup is a digital studio based in Stockholm, Sweden that has been working with digital businesses, products and content. Since its inception in 2001, Apegroup has been involved in over 100 digital initiatives, having delivered valuable results for organizations like McDonald’s, IKEA, and Fortum(Sweden’s biggest energy provider).

Apegroup told us about the structure and organization of their teams, their strategies when working on projects, how their teams collaborate, and also gave us a peek into some interesting projects they did with IKEA and McDonald’s.

Apegroup created quick and simple purchase flows for Fortrum to interact with new customers.

The beginning

The team started out as an agency building video streaming services in Flash, in a small basement. All this changed when the iPhone was launched. Apegroup pivoted into native mobile development and out went the old code.

Today, it is a full service agency with over 50 designers and developers. The team mainly provides product design and development services for clients. On the solutions they build for their clients, Apegroup said:

“We build digital products that people use, not just campaigns and landing pages. We’ve got our roots in native mobile design & development, but nowadays it’s a lot of web and mixing native and web solutions. We love to do innovative stuff, so we try to find clients that share our mindset. Our biggest client at the moment is McDonald’s. We also work with Fortum, a bank called Söderberg & Partners. Lately we’ve also worked with a whole bunch of startups, which is really exciting.”

Most new clients come from the recommendations of pre-existing clients. Apart from this, client teams also network and reach out to prospective clients that may need Apegroup’s services. The client team researches clients ahead of time and zeroes in on a relevant problem that the studio can solve.

How the teams are setup

Cross-functionality is crucial part of the design and development process for the studio, on projects, as it equips the team with a more holistic outlook to tackle challenges and simplifies collaboration between designers and developers.

source: Apegroup

Apegroup has a design team, a development team and a business design team. On the ‘client team’ are a design director, a technical director, and a business director, that connect the three core teams as per the requirements of the project.

Timeline of a project

The design and development team at the studio focuses on rapid deployment and agile development.

“We work in two week sprints, and deliver something at the end of every sprint. We try to start bigger projects with a week of research, or an “unpack week” as we call it. Timelines change from project to project but we usually go for 4 weeks of concept and 6–8 weeks of product design, and definition. Typical deliverables are: user journeys, development roadmaps, prototypes and design assets in Zeplin. But what type of deliverable a client gets depends on the project.”

The macro decisions on the project, such as what technologies to use, are an interesting mix of client and team decisions. Some times the senior-most client contact dictates these choices. There are projects where clients already have expectations on the technical aspects, and on other occasions the team votes on it.

Design Principles

But at the heart of all these decisions there has to be a unifying vision, which the team can focus on executing.

“One method we use to make sure our design decisions are coherent is setting up design principles — a set of statements that define what we want the project to be. These are softer, non-measurable values that we all agree on ahead of time, for example ‘we want every interaction to feel positive’.”

Smaller decisions are informed by macro design principles that guide every interaction

These design principles come in handy when working on the micro decisions like UI interactions. Design principles help the team stay aligned with their goals and on the same page. In order to maintain this vision across the project, decisions are discussed within the context of the principles agreed upon earlier.

When it comes to technological decisions, scale is a factor that dictates what will be feasible. Other considerations are reliability, maintainability, and very importantly, how future proof would be the approach be.

Project workflow: The advantage of modularity

Since Apegroup works with clients on different kinds of projects, having a modular methodology helps tailor the process to the needs of the client.

The team looks at their processes as five different projects —

• User and market research
• Concept development
• Product and service design
• Software development
• Measure and improve

On the benefit of having such a flexible arrangement, Linnea explained:

“We can start any of these projects without running a previous one, as long as the requirements for starting one are met. For each project type, we have some set deliverables and activities, but we mix and match the activities depending on what’s right for the project.

Having different project types is more flexible for our clients — they can work with us when they need us most instead of a “gotta buy the whole package” deal. If we use a concept project as an example — we recommend it when our clients have a clear and proven problem without a clear solution. We explore, ideate, create a prototype, and test how the idea is received by users (it’s a variation on a google sprint). If the tests are positive, we recommend following with a product design project, where we do more detailed design work that can be developed.”

Collaboration

One area that we were especially keen to learn more about is how the designers and developers collaborated at Apegroup and how involved was the client in the entire project.

Internal collaboration

On the whole, different teams like designers and developers have their own working space but they also work together closely in project groups. The degree of collaboration between designers and developers is influenced by what kind of project the team is working on.

For projects that only include concept development, user research or designing mocks, the developers are less involved. However, they do advice the design team on the technological scope and intricacies of the project.

If the project involves development from the outset, then it is reflected in the developers involvement from the beginning. At the conceptual stage, developers do technical research based on the needs of the project and create a rough draft of the system architecture.

In case the time to market is critical on a project, then developers start building the features already designed, while designers work a sprint ahead on the next set of challenges. Designers actively participate in developer stand ups and sprints so that they are aware of requirements and can advice on any design components when needed.

Apegroup’s office in Stockholm, Sweden

Since teams sit close together, they can have quick feedback sessions for minor issues and face-to-face meetings for more detailed discussions. Their 10,000 feet creative collaboration space is surely helpful for this.

Key enablers of the collaboration process are tools. Here’s what helps Apegroup’s team work together:

• Slack. For company wide communication. Each team and project operates on a separate channel
• Confluence. To host the team intranet
• Google Suite & Dropbox. For file sharing and collaborating on documents
• JIRA. For tracking issues and supporting the project
• InVision. For building and collecting feedback on prototypes
• Zeplin. For sharing design assets

Working with clients

When it comes to working with clients, Apegroup prefers having a clear and open channel of communication. To achieve this clients are invited for in-person meetings when needed and a dedicated Slack channel is setup for them. Having a tight loop for collaboration helps avoid ambiguity and misunderstandings.

“We avoid this process where you send off a chunk of design for formal approval and feedback. Most of the time it’s better to bring some sketches and sit down with the client, bringing up questions and showing how you’ve reached conclusions. The more of these informal work sessions we have, the better. We get more valuable input from the client.”

Another feature of this is that one person is requested to be assigned as the chief communicator from the client side. That one person is responsible for communicating the client’s needs and feedback to Apegroup’s team. They also act as the advocate for the design and development team when explaining project decisions to other stakeholders on the client side.

“It’s helpful to limit how many clients give feedback on work in progress — evaluating new ideas can be hard if you’re not used to it, so people can often get worried. There’s much less worry when you have one advocate who really understands the project, as long as the company trusts them to do what’s best for the company.”

There are, of course situations when clients cannot come to Apegroup’s office for review and feedback sessions. In case the studio needs to collaborate remotely with clients they use appear.in for quick video meetings.

Working with McDonald’s and IKEA

McDonald’s and IKEA have been among the more high-profile clients to work with Apegroup.

The McNavigator App created for finding the closest McDonald’s outlet

With McDonald’s the relationship started with an app called the McNavigator. It helped users find the closest McDonald’s outlet in Sweden. This was when the App Store and mobile apps themselves, were still in infancy. The app has since evolved from beyond a discovery platform to one with CRM capabilities and marketing automation. Today, McNavigator is also available across Croatia, Denmark, Finland, Greece, Jordan, Morocco, Poland, Saudi Arabia and Switzerland, with more expansion planned for the future.

With IKEA the project is still ongoing and for internal teams. IKEA needed a digital solution that supported and enabled an activity based office. The project scope ranged from ideation to testing physical prototypes with IKEA workers. After creating and testing concepts across the major problem areas, Apegroup is now helping IKEA study and define the technical, physical and organisational infrastructure needed to make the most promising concepts a reality.

The BeatQuiz Campaign

The BeatsQuiz campaign created for McDonald’s

A design challenge we were very interested to talk to Apegroup about was the BeatQuiz campaign they created for McDonald’s, initially for Swedish customers. BeatQuiz is real-time music quiz that lets users in McDonald’s outlets identify the songs being played and challenge friends as well. It has now been expanded to multiple countries.

This is an interesting project, from both the design and the implementation perspective.

The main challenge in designing such a game is that the questions on the quiz have to be synced to both the music playing at the restaurant and to all the players simultaneously. In order to achieve this Apegroup built a mediating layer connecting McDonald’s restaurant and product data to the “Soundtrack Your Brand” playlist back end. The game also uses the Spotify metadata API to create custom questions for every song.

BeatsQuiz was a significant challenge in terms of design and implementation. It combines product data, the playlist backend, Google cloud platform and the Spotify API

The other challenges on the project were those of localization and fragmentation.

“Not only do you need to localize your design (for example, right-to-left in Arabic) and ensure the visuals work with every culture, you have to take legal aspects into consideration, as they vary between countries. You also have to take operations into consideration. Creating a digital product that demands a full-time employee to manage might not be an issue for a large country but can be impossible for smaller ones.

The challenges are often results of corporate structure. When working with a more decentralized company, problems like fragmentation appear. For example, if we want to design solutions that require specific infrastructure, like QR-scanners, there’s no guarantee that every country will implement it. Each market is more autonomous when the company is decentralized.”

This project was certainly a tremendous achievement in the application of technology and the scale of its application.

The projects and strategies at Apegroup underpin the importance of collaboration to design and development teams today. Throughout their growth from a small team building Flash products, to a team of more than 50 building multi-national products for a global audience, Apegroup’s team has followed the principles of having clear communication channels and workflows that enable everyone — whether designers or developers — to do great work.

Apegroup looks for people who are open-minded and passionate about digital products to work for them. People who are enthusiastic about learning, exploring and experimenting. If you’re interested by challenges and work at Apegroup, you can find out more about open roles here.

We’re grateful to

Linnéa Strid

for helping us get a peek into Apegroup’s functioning. To read more about Linnea’s work, you can follow her on Medium here.

zipBoard is built to solve the issues of collaboration for team members working on websites, web apps, eLearning projects or mock ups and prototypes. Read more about how your creative collaboration can be simple and better with zipBoard here.