produck

The world's most efficient tool to manage projects.

SERVICES

Strategy, Branding and Communication, Web Design & Implementation, Product Design, Front-end & Back-end Development.

TEAM

5 Product Designers, 3 Project Managers, 8 Front-end Engineers, 3 Backend Engineers, 1 QA Analyst

TIMEFRAME

January 2018 - Ongoing

Every day at Bons we help innovative businesses, startups and entrepreneurs create the future. But this time we set out on an adventure of our own: building an internal startup from scratch.

The result was Produck, a work management platform that helps teams be more efficient and achieve more at work with modern functionality and powerful planning tools.

With Produck, we created everything, from the initial idea to the business model, branding, communication, websites, product design, development and more.

discovery and research

We've collected all necessary information and context and created a number of visual assets that help everyone involved to understand what’s going to be built and how. 

Research competitive landscape
For Produck, we’ve researched the competitive landscape and found that all project management tools focus on the planning part -the job of the PM- but not on what the team needs to successfully get things done. 

Identify target market and user base (customer segments)
The competitive landscape research gave us the key insight to dig deeper on our target audience. Using the Jobs-to-Be-Done framework we identified Produck’s Customer Jobs, Pains and Gains.

Finding work gratifying is hard; and teams often feel like "task pushers," which causes a lack of motivation as well as project delays, failure, mistakes, or at worst team turnover. Team Members have different expectations of the role work plays in their lives, and having a team that feels satisfied and impactful at work is fundamental to project success.

Information cards

Define product value proposition

Produck helps your team be more successful

Through customer segmentation, we defined the product value proposition by outlining the Gain Generators and Pain Relievers: A work management platform that besides great planning functionalities helps your team be more efficient and achieve more at work.

Branding

We wanted to create a brand that is memorable, fun and powerful. In order to do this, we’ve played with the word “product” and associated it with ducks. But we didn’t want a fluffy duck, we wanted to show a powerful duck, taking off in flight.

Composition for branding material

communication design

A memorable brand needs to survive every medium. As Produck creates and sponsors a lot of meetups and events for product people, we've designed several pieces that extends the brand identity as a cohesive and powerful open system.

Produck Popup Banner
Produck CupProduck Bag
Icons

THE WEBSITE

Produck’s website needed to communicate more than just the product features (most websites should do this). So we focused on creating a website that shows the value of using Produck while explaining how Produck can make you and your team more successful at work. 

Laptop Screen showing the product

24%

Conversion Rate

1 in every 5 who visits the site creates an account.

32%

Bounce Rate

Half of the bounce rate of the average in the industry.

500+

Launch Day Signups

Soft launch with 500 signups in a single day.

More than just a landing

We didn't stop by creating a beautiful landing page, we've also focused our efforts on creating solution pages targeting specific use cases (startups, enterprise, agencies), and integrating the help center right into the website by building it from scratch.

Slider with product screens

A fully-featured SaaS Web Application

To create a meaningful experience that makes project management and teams more successful at work we had to raise the bar on pm tool standards, focusing on UI/X, performance and scalability.

THE Workspace

The Workspace is for the Project Managers so they can easily plan and schedule tasks, and keep everyone in the loop on what’s happening and what needs to be done.

  • Visualize tasks as a List, Kanban boards, or Timeline

  • Group tasks by status, priority, assignee, and more

  • Organize projects and sprints on your folder tree

  • Powerful Tasks with inline-rich editor, multiple assignees, and more

  • Portfolio monitor with Live Burndown Chart & Release Reports

Screenshot compositions
Screenshot compositions

The Inbox

We've built the Inbox for the team, those who get the tasks done, so they can seamlessly see the tasks that need their attention, check when the next meeting is coming up, and keep up with progress.

  • List of tasks that require attention with useful groups and filters

  • Google Calendar integration to see when interruptions will happen

  • Google Drive integration to easy access docs and files

  • Gamification of work with Inbox Zero and Peer Recognition

  • Analytics and Team Performance stats to keep the team motivated

Wireframes

Our process starts by creating a moodboard and wireframes to ensure everyone understands what is going to be built and how. For Produck, we created wireframes that reveal how the application was going to be structured for a great user flow.

Multiple Wireframes

the technology behind

We pride ourselves on embracing the latest technologies and deeply care about standards and processes.

We first focused on creating a solid infrastructure for Produck's web app that keeps flexibility in mind, so we could grow and scale the application alongside the business side of it.

Icon NodeJS

NodeJS

Icon React

React

Icon GraphQL (apollo)

GraphQL (apollo)

Icon PostgreSQL

PostgreSQL

Icon Restful

Restful

Icon Stripe Billing

Stripe Billing Integration

Icon Continuous Integration

Continuous Integration & Deployment

Icon Docker Swarm

Docker Swarm Environment

Icon Agile based methodology

Agile based methodology

Icon Comprehensive Documentation

Comprehensive Documentation

Icon Type Checker JavaScript

Type Checker for JavaScript: Flow

Icon PWA

Progressive Web Apps (PWA)

mobile experience

Progressive Web Application (PWA)

To keep working moving forward, Produck needed to perform beautifully on every device, not just mobile. With that in mind, we've decided to make Produck one of the first Project Management tools using PWA standards which allows the Web Application to work as native on all devices.

Phone Screen showcasing Produck
Phone Screen showcasing Produck
Phone Screen showcasing Produck
Phone Screen showcasing Produck

powerful features

We've built in powerful features behind beautiful UI/UX, so users can do everything they need to do but in a quick and easy way. Produck is a powerful SaaS application, not a complicated one!

Image Produck permissions

Supercharged permissions

Manage who has access to a folder, sprint, or project, and use Role & Permissions to define what each member can view or edit.

Image Produck real time

Everything in real-time

Enjoy a real-time experience, where everything you do is live updated for all of your team, even when working on different projects.

Image Produck live comments

Powerful live comments

Comments have the same rich-text editing as descriptions, and they are live updated so you can have conversations in real time.

Image Produck cross-project tasks

Cross-project tasks

Perfect for when your team has different departments that share some tasks, such as your engineering and success teams.