Open Design Process

When I first got involved with the open source community, I had plenty to learn. I delved into the philosophy of open source, the Creative Commons copyright licenses and other licenses as well as meaningful contribution to ideas, projects and products. WordPress was probably the first product I started using and understood as open source. Since then, I tried out hundreds of open source projects, products and software packages, thanks to amazing people who post projects to GitHub, LayerVault or make them available through their Dropbox account.

Truth be told, there are some projects on GitHub that I absolutely cannot fathom how they were conceptualized and built. I’m just not that skilled as a developer. My wheelhouse falls into a few niches; front-end development, a bit of server side coding mainly PHP and Javascript and I am slowly learning Python. I can contribute to projects in other ways though. My contribution most often is examining the design approach; the user interfaces and the experience are always things I pay close attention to. I also add ideas to strategic planning and how to engage others in the project, sort of like acting like an account executive but instead selling services, I bring resources and connect people who can help. In the past, I’ve detailed the process for developing the PAFP Community, a BuddyPress-powered online community of practice geared towards family physicians in Pennsylvania. I shared the process how I conceptualized the project, the initial design constraints, the building process, plugin adaptations, marketing and community building and launch. I’ve talked about using BuddyPress as an enterprise solution for company intranets and private social networks at WordCamps and conferences for the past year. It’s been an amazing experience to go and speak on WordPress, BuddyPress and other developer related topics at conferences, but I feel that there is a still an field that can benefit from embracing open source principles and practices: design.

Now it’s hard to define what open source design is since the word “design” is used in many divergent contexts. What I am referring to is geared more towards the design thinking process for visual designers such as graphic designers and web designers. The design process is, at its heart, a seven-step path that almost all designers follow to create a viable solution.

  1. Define the problem
  2. Collect information
  3. Brainstorm and analyze
  4. Develop solutions/build a test model
  5. Present your ideas to others for feedback
  6. Improve your design
  7. Reiterate

If you look at the steps in the design process, you can understand how each of these steps is naturally open. At no point does any of these steps focus solely on keeping ideas and progress behind the veil. Every step along the path can be open, shared, and collaborated on with interested parties. In code, its simple and often the development process is the same as the design process (albeit with more testing and debugging built in). With services like GitHub and BitBucket, you can fork a project, make a fix, and submit a pull request to the project owner. If you think about that process of collaboration, it’s really no different for design as well.

Open Design Process & Business

Unfortunately, there is a massive set of obstacles imposed on what open design process can become in a business environment. Designers at one agency will surely not share client work that is in process with their colleagues from a rival agency or studio. The nature of the business side of the creative industry is to keep talent close and share with no one, until the checks are signed, wallets are fattened, and the project is live. Many companies see the open source philosophy as an anathema to the very ideas of business growth. While this isn’t the case everywhere, there is still plenty of opposition to open source out there, and for something as radical as opening up the design process, the audience willing to listen is smaller and even more divided.

In the advertising and design realms, opening up your process is a mixed bag. For most agencies and design studios, the process is carefully guarded as part of the company’s business practices and trade secrets. Talent and knowledge is valued and guarded. For most companies, open sourcing your work is tantamount to corporate espionage.

Not all companies believe that open source is a bad thing. ZURB is a product design company in Campbell, California that built Foundation, the first commercially viable free responsive front-end framework in the world. What makes ZURB interesting is that they started Foundation as their own in-house style sheet, completely proprietary, and over time they worked on it to build out the framework (From a design and development standpoint) and eventually opened it up to all, free to use both for personal and commercial use. They still work in the client service realm. Automattic is another company that is built upon open source software, WordPress, and utilizes smart, agile design thinking as part of their process. Automattic is a company that not open sources their software, but is one of the few where the software be molded around the visual design solution as you see appropriate. Automattic is another company that by their client service offerings are still utlized. Without WordPress, there wouldn’t be the plethora of companies like Webdevstudios, WP Engine, and many others; all of whom utilize open source software for client service projects.

Many of the big questions that companies will ask is how can they make money if their process is completely open? How do they protect their assets, their clients and their resources if everything is open? How do they maintain their competitive edge if all of the cards are on the table? Won’t open source give away all of our knowledge and thinking?

These are good questions to ask but, if reframed correctly, can be great explorations to build better client relations. In my experience, clients are typically buying your expertise, not a generic product. There is a big difference from clients who want to have a custom built website suited to their needs and those who think they can just get by with a Facebook page. Expertise value versus a generic product with mass (supposed) buy in. When you open source a project, you’re not giving away your expertise, you’re inviting those to contribute to help build something better. For design, this is the collaborative process in a nutshell. Many times, designers working in the advertising realm will work in a group with other designers, a copywriter, and an account executive to build a solution for client, be it an ad campaign, a new website, a brand identity or a commercial. Already, they are open between themselves. Shows like Mad Men and The Pitch portray many in the advertising world with massive egos (and to an extent, this is very true), but at the heart of every great ad agency, no one person is the be all, end of all a project. So how do you get the openness to go beyond the walls of the office building? Let’s reframe those questions.

How do we position ourselves as leaders and influencers in an industry and sector?

How do we showcase our thought process and thinking with other prospects and client in a way that is understandable and relatable to their understanding?

How do we find the talent that best fits with our mission and purpose and bring them into our fold?

How can we establish trust and transparency with our client, their audience and other professionals?

How can we better partner with others in ways that are meaningful and long term?

These are pretty deep questions to ask for any business owner, agency president, CEO, and creative director to ask. If they are willing to try something different, try something open than the opportunities that can present themselves are worth taking that risk. Even if only one project is open sourced; design thinking and all, wouldn’t it be worth the risk to try to be different?

Open Design Thinking

In Brad Frost’s post “Design in the open”he details the pros and cons to working openly, from a designer’s point of view. He points to an article from Forbes Magazine titled“Ideas are a dime a doze, People who implement them are priceless.” that talks about how ideas are everywhere and we are swimming in them each day. For an idea to take shape and become something real, that takes something entirely different to achieve, It takes willpower, bravery, determination and many other attributes. To paraphrase a quote from Batman Begins.

“…if you devote yourself to an ideal, and if they can’t stop you, then you become something else entirely.”

Now, understand that Liam Neeson’s character was referring to Bruce Wayne becoming Batman, but the sentiment is same. The idea itself maybe good, but to implement it takes strength of character and can propel you into another realm altogether.

How does this work for design? By opening up your process, you’re showing the world that you want make the design world better by sharing process, elaborate on your design thinking and critically observe the marks and space we create and rework in a project. By designing in the opening, you leave yourself open to criticism but also allow yourself the chance to become a better designer in the process.

One big question is how do you get a client to get on board with open sourcing a project. You need to show the value in the process of open knowledge and putting it out there. Brad Frost’s“Design in the Open” actually details the benefits of designing in the open thoroughly in his post. His post is very helpful for detailing how open design can work in the business realm, especially in the world of design studios and even ad agencies. For ad agencies or design studios, maybe it’s not opening sourcing a client project (yet) but rather begin to contribute to starting a self generated, in-house, open source project and applying the WTFPL license to it. Maybe create a set of design patterns, standards, and icons that you share with the world and invite others to contribute to an ever growing library.

For those who are still on the fence about whether or not by opening your design process that others will come in and steal your work or worse steal your client, there is one thing that help make that relationship solid: a contract. A contract is just a formal declaration of responsibilities and details of the nature of a partnership. If you provide great customer service along with a contract and an open nature, you’re clients will be hard-pressed to find a reason to leave.

How to Design in the Open

Another question is how to do you actually design in the open? There are several approaches. By blogging and sharing your sketches, initial thumbnails and comps, you’re designing in the open. This is like making a live case study of your work. A popular site that originally was dedicated to showing works in progress was Dribbble. Dribbble is still a great platform to share the design process openly. Another way is to literally open up your files and allow others to participate in the process, very much like code. Services like Dropbox can be utilized for others to fork your files and be requested to be utilized in main design project. A new resource for visual version control of files is Pixelapse. Working like GitHub, you can have multiple people contribute to your design projects by getting access to your files and pulling them back into the main project. A leader in version control for designer is LayerVault. LayerVault is one of those unique services that leverages the power of the community (internal and external teams) to build the best solutions from native files such as PSD, AI, Sketch, and others. For the front end developers and designers who are familiar with Github, this process acts very similar. Another way for you to work in the open is to utilize SVG. Garth Braithwaite’s video from BlendConf discusses the use of SVG as a file format both usable to designers and to developers to create viable, open designs that can be utilized for open typography, logo and identity marks, illustrations and other uses.

Open Source and Education

Open source philosophy has always worked hand in hand with education. The idea that to open the software development process for all to learn from and build something better is fundamental to the philosophy. For design, this is an enticing avenue to explore to help make our field a better one. An open design process can help others think more critically about their work and how to improve upon it. This a fundamental point of the design process; define a problem, create a solution, revise, reiterate.

For myself, I’ve learned a tremendous amount how to think logically and how to begin to design and develop front-end assets that utilize other frameworks, plugins or my own home grown solutions. Sites like Stackoverflow, JSFiddle and Codepen have allowed me to ask specific questions, test code and discover new solutions and ideas that have helped me become a better designer and developer that in turn helps me provide a better service to my clients as well as allow me to full grasp code structure and application to teach others. For design, sites like Dribbble and a personal blog allow me to detail my thinking and implementation. When you working files to share you can utilize downloadable content, either through your site or through Dropbox, for others to pull down, use, rework and re-submit for inclusion. This can create immense learning opportunities for others to participate in and contribute to.

Going Forward

This November, I will be talking about this very topic at the Central Pennsylvania Open Source Conference in Lancaster, PA this November. My hopes are to bridge the gap between developers and designers by identifying common points of process and show how designers can start participating in a wider world to make artifacts and resources that are meant to be living items. In the future, I want to continue contributing anyway that I can to open source projects, be it in the development realm or within the design realm. Personally, I believe that by designing in the opening, we will have leveraged the most powerful tool we have to building a better system of education and exploration for everyone to participate in.

Big Ups

I really want to thank Brad Frost for this awesome post “Designing in the Open”. It taught me a great deal about how to to design in the open and really put into perspective the pros and cons of working in such a way.

Garth Braithewaite really took the idea and has started to apply it for the masses. His presentation from Blendconf really hit home with me (being a history buff, I thoroughly enjoyed hearing all about how the open source philosophy got started) and his manifesto struck me on a personal level. His site is a true resource and I hope to contribute to it soon. Check out his session at Blendconf below.

The people at Github, BitBucket, LayerVault, Pixelapse, and Dropbox who make life easier for designers and developers to share live files with the world.

ZURB for making Foundation and sharing it with everyone.

Automattic. I’m really not sure how to thank them without gushing all over the place. I mean, come one, WordPress. Thank you.

Big ups to AIGA’s Design For Good initiative which has huge potential beyond just design. Not exactly an open source initiative, but definitely an avenue to become one.

Dribbble because so many of the daily shots keep me pumped to be a better designer.

Everyone who worked on the standard for Scalable Vector Graphic aka SVG.

Also a big ups to software applications like GIMP, InkScape, and OpenOffice who continue to give designers freedom from subscription based services and proprietary software packages.

Finally, big ups to my pals on Twitter who have shared there thoughts, ideas, stances, and counter-points on writing this article. You’ve all made me a better writer.

A single golf clap? Or a long standing ovation?

By clapping more or less, you can signal to us which stories really stand out.