1. Set Up a Project Management Foundation
Before you begin collaborating, you’ll want to make sure you have an actual system set up. “I want to move forward, but I’m not sure what’s approved.” How often have you said that to your team? Some teams have a lot of fire in them. They like to dive right into the problem to find the solution, but that could cause a lot of problems later on. Most design problems aren’t actually design problems, they’re management problems. [pullquote]Most design problems aren’t actually design problems, they’re management problems[/pullquote] What happens if you have the best designers in the world, but you fail to explain the client’s problem properly? What if the designs they send keep getting rejected? And what happens when the designers and writers understand the project differently? The key is to develop a solution that actually works for everyone so project managers can properly understand and explain the issue, and designers and writers can develop solutions that work for those problems. According to Sara, a Project Manager at Entermotion: The key to smooth design/writer collaboration is in the communication process; It’s important to be able to properly speak the same “language” so that all sides of it (design, writers, project managers) know exactly what’s needed and what’s being said; I think a lot of the mistakes in the process come down to a misunderstanding of the smaller details; Those smaller details can derail a big portion of the project even if they seem minuscule at first; Having everyone on the same page from the beginning and not starting out with “I think they want it like this…” (which leaves people assuming) or with too many open holes in the details can be detrimental to the whole process. This is the most important step to take when planning a website. You need a careful project manager to help ensure the success of a project by exploring what the creatives can handle, how project success will be measured, making sure the creatives can dream big while sticking with a nightmare-size budget, and a detailed plan for how the designers and creatives can make it happen. Each project manager will have her own tools, but there are a few trusted apps that we know can get you on track:- Develop a design structure to help you meet your goals
- Align your team’s goals with Basecamp or Asana and assign due dates, track projects, upload media content, and set calendar goals together.
- Visualize your team’s progress with Trello or Notion
- Keep up with your team on Slack or RocketChat
2. Understand Project Scope Before Getting Started
Project managers should help determine all of the key project elements (and those tiny details that could derail a project):- Project Goals
- Deliverables
- Project Functions
- Desired Features
- Desired Deadline
- Agreed-Upon Budget
- Is the client hosting their own website?
- Is the client using a third-party company to get a logo developed?
- Does the client have a deep connection with a marketing firm that will help them?
- Who is the main decision maker for the company?
- Does the client fully understand the scope of the project?
- Does the project manager fully understand the scope of the project?
3. Kick off Content First
Collaborating for better design is about making sure the design and content team has a unified vision of what’s happening. Agencies and small teams handle this differently, but each leads to the same goal: getting the designers and writers on the same page to create something beautiful and avoid any pitfalls. Here’s how to lead a great kickoff chat:- Present project and deliverables needed
- Give people time to come up with ideas
- Set clear expectations and goals
- Research before presenting
- Develop a singular vision
- Outline responsibilities for next steps
- Understand a project’s end goals
- Define and understand audience needs
- Determine main aesthetics and aesthetic goals
- Define information architecture
- Develop content ideas
4. Wireframe and Determine Content
Set up a way to wireframe, prototype, and develop content as the design elements shift if you don’t have one already. As you move on from the kickoff chat, it’s important to have flexible tools that shift with the content.Wireframe.cc
Wireframe.cc – starts at $16/month. This is a clean app that shows you the elements you need only when you need them. A context-sensitive tool bar and a limited color palette make it simple to create sketch-like wireframes in a pinch.FluidUI
FluidUI is a prototyping tool to help you communicate information architecture to clients and receive realtime feedback on prototypes. This goes a little beyond simple wireframing because you can hop on an in-app video call to discuss each project as it’s happening.Mockflow
Mockflow is a collaborative UI tool to help remote teams wireframe. It’s free for one project and goes up to $160/month for enterprises. Teams can brainstorm UI ideas on the go, export designs, and work with a library of wireframe templates. [pullquote]when you use the right tools, your wireframe or prototype can shift with the design elements[/pullquote] Wireframing can be a collaborative part of the design process. Elements of the design might shift, but when you use the right tools, your wireframe or prototype can shift with the design elements. When you’re working on a remote team, it’s important that all members feel empowered to get feedback and collaborate properly. With the wireframe tools above, team members can get client feedback, uncover new solutions, and connect with their team. Designers and copywriters can use wireframes to get specific feedback on projects. During a back-and-forth session, team members can ask for specific feedback:- How do you feel about animating the first half of this?
- What if we turned this text into an infographic?
- How will we be designing this?
- Do you have ideas for hover text here?
- Does the client want a video masthead here?
5. Work with a Content Management Platform That Supports Your Needs
Copywriters need a way to access older versions of copy and designers need a clean way to see what content was approved and what goes where. If your team works with smart content management platforms, they’ll be able to do everything they need in one place.- Google Docs or Zoho Docs allow teams to share assets, so remote companies can all see the same progress
- Brainstorm in Dropbox Paper or Evernote to outline goals, responsibilities, and project needs.
- Create a hierarchy in Jumpchart or Airstory so clients can see what content will be planned, where it will go, and what information they need to develop.
- Control versions so each team member can work on the most updated version
- Track changes so you can see who changed what, when
- Follow client feedback, if any
- Allow designers and copywriters to collaborate effectively, and work with tools that morph as the content or information shifts
6. Collaborate with Your Bosses and Clients for Full Approval
Before you submit the deliverables to your clients or bosses, decide how you’re going to present it.- Create a framework so your clients and boss understand the way in which your deliverables will support the clients’ main goals
- Create an index of topics you’ll cover during the meeting
- Discuss what stage your work is in and how it will be incorporated when it goes live
- Commit to an action plan
- Meta copy has been developed
- Content is properly placed
- Background information is prepared
- All content is created and has been proofread
Takeaway
Collaboration is about asking the right questions, coming to the table with an open mind, and ensuring that you have processes in place to execute a clear plan. Once you have a clear action plan, designers and copywriters will be able to collaborate for powerful projects that please the project managers as much as the clients.Kallie Falandays
Kallie Falandays writes for Entermotion, a website design studio based in Wichita, Kansas, and Paste Interactive, the founders of Jumpchart, a web app that makes writing for the web simple.
Read Next
15 Best New Fonts, July 2024
Welcome to our monthly roundup of the best fonts we’ve found online in the last four weeks. This month, there are fewer…
By Ben Moss
20 Best New Websites, July 2024
Welcome to July’s round up of websites to inspire you. This month’s collection ranges from the most stripped-back…
Top 7 WordPress Plugins for 2024: Enhance Your Site's Performance
WordPress is a hands-down favorite of website designers and developers. Renowned for its flexibility and ease of use,…
By WDD Staff
Exciting New Tools for Designers, July 2024
Welcome to this July’s collection of tools, gathered from around the web over the past month. We hope you’ll find…
3 Essential Design Trends, July 2024
Add some summer sizzle to your design projects with trendy website elements. Learn what's trending and how to use these…
15 Best New Fonts, June 2024
Welcome to our roundup of the best new fonts we’ve found online in the last month. This month, there are notably fewer…
By Ben Moss
20 Best New Websites, June 2024
Arranging content in an easily accessible way is the backbone of any user-friendly website. A good website will present…
Exciting New Tools for Designers, June 2024
In this month’s roundup of the best tools for web designers and developers, we’ll explore a range of new and noteworthy…
3 Essential Design Trends, June 2024
Summer is off to a fun start with some highly dramatic website design trends showing up in projects. Let's dive in!
15 Best New Fonts, May 2024
In this month’s edition, there are lots of historically-inspired typefaces, more of the growing trend for French…
By Ben Moss
How to Reduce The Carbon Footprint of Your Website
On average, a web page produces 4.61 grams of CO2 for every page view; for whole sites, that amounts to hundreds of KG…
By Simon Sterne
20 Best New Websites, May 2024
Welcome to May’s compilation of the best sites on the web. This month we’re focused on color for younger humans,…