How to plan & create a website or app. Not another design process.

HV Project Model: Our framework to approaching challenges and handling web or app projects in collaboration with clients and partners.

Dan Nessler
Hinderling Volkart

--

When faced with the challenge of creating, designing, building or re-designing one’s website, we often talk about the design and development process. This is neither another process nor an article about one.

Process vs. Output vs. Collaboration

Most companies or agencies have a certain way of working. Approaches vary from conventional waterfall approaches on one to agile methodologies on the other end of the spectrum.

No matter what approach you take, oftentimes people involved in such a process struggle to comprehend what a specific phase of a process means and what deliverables or outputs are essential or required.

To add clarity for our team, partners and clients, we have developed the HV Project Model. It is not a process but a modular approach to a way of collaborating that lays the foundation of how we approach challenges, handle projects and create solutions together with clients and partners.

Our approach is based on three overarching principles:

We believe in the power of teams.

  • By involving everyone right from the start of a project, we gain more than we invest: Efficiency. Quality. And a lot of fun.

We believe in the uniqueness in every client and challenge.

  • That is why we not only design and implement tailor-made projects, but also customize our collaboration.

We believe in and strive for creativity and innovation.

  • Our modular approach is a playground for ideas. And thanks to a common understanding of a problem at hand, we work towards a clear and single-minded goal.

How to get started — The HV Project Model

At the core of our HV Project Model, we have introduced a framework consisting of so-called project modules that we may need in a project.

Project Modules Map / Overview (no particular order)

The listing is neither comprehensive nor restricted but it helps us answer the following three core question at the beginning of every project.

  1. What is our project understanding and who is involved
    (initial situation & team)?
  2. What are the needs and deliverables
    (project modules required)?
  3. What is our project approach
    (project structure and process)?

These three steps and questions in detail:

1. Project understanding and parties involved

At the beginning of a project, we ask ourselves about the people and parties involved, the way of collaborating and the culture we want to set up. To do so, we usually run a team-aligning activity, for example, by conducting a team canvas.

Work-in-progress team canvas — http://theteamcanvas.com

Furthermore, and to gain an understanding of the initial situation and challenge, we apply a so-called project canvas to gather existing knowledge such as:

  • Initial project situation and background of the company or product, values, vision, mission, branding (e.g. applying the golden circle framework) and project goals set by a client.
  • Business needs (viability) — what are the actual needs of the involved stakeholders, the business and what is the market situation.
  • Technical requirements and constraints (feasibility)— what are technical givens and opportunities to take into account or worth exploring.
  • User needs & Jobs to be done (desirability)– Who is a product for, what are target groups, personas and what are their core jobs to be done.
Work-in-progress project canvas — inspired by IDEOs DFV famework.

There is no need to answer all these questions upfront. Applying the project canvas framework helps us to align our initial understanding of the current situation and our team, and it helps us to reveal potential areas to work or do research on, which brings us to the next topic.

2. Project needs and deliverables

This is the core of the HV Project Model and its underlaying modules. Based on our initial knowledge and understanding we are capable of making a first assessment of what we think might be valuable or necessary in order to scope a project, potential work packages and deliverables.

Collaborative card sorting activity. Evaluating what project modules might be required. Obviously, also possible done remotely e.g. using Miro boards

In a collaborative session involving relevant parties and stakeholders, we literally shuffle a deck of physical or digital project module cards.

We conduct a card sorting and define what we believe will be required to gain a sufficient understanding of the core challenge and thus how to solve it to reach our goal and build final product or solution. Here is a list of potential project modules (not comprehensive and in no particular order):

Foundation:

  • Project Canvas
  • Team Canvas
  • Risk Map
  • Project plan

Ideation:

  • Market & Trend Benchmarking Report
  • Digital Strategy
  • Persona
  • User Journey & Experience Map
  • User Stories (JTBD)
  • Content Inventory
  • Content Strategy
  • Content Concept
  • Information Architecture
  • SEO Review
  • Analytics Report
  • Visual Concept & Mood
  • Visual Concept Test Report
  • Digital Brand & Identity Guide
  • Lighthouse (product vision)
  • Technical Concept

Implementation:

  • Wireframes
  • Click-Prototype
  • Screen&Production Design
  • Specifications
  • Frontend Code
  • Backend Code / CMS
  • Frontend Test Report
  • Backend Test Report
  • Accessibility Review
  • Accessibility Audit with/without certification
  • Usability Test Report
  • Design & Living Styleguide
  • Analytics Setup
  • Content (Text, Imgs, Videos, Animations etc.)
  • Content Implementation Guidelines
  • Hosting
  • GO Live Experience & Concept
  • Backend/CMS Training

Iteration & Improvement

This is neither a finite list of deliverables and artefacts nor a step-by-step process as «foundation», «ideation» and «implementation» might imply.

We have found this categorisation beneficial when collaborating. They provide some sort of structure without constraining us.

You may apply the different modules flexibly and in almost any order. Once your product is out, you iterate by analysing, improving and solving challenges that might occur.

This brings us to the next chapter.

3. Project approach and structure (or process)

Often times companies advocate for one specific design or development process. Although such an approach might be of value or even a potential USP of a company, we believe that the best way to determine a process is to first understand the initial challenge, the goal, activities and potentially required deliverables to reach a goal.

That said, and once we have collaboratively defined who we are working with, and what we are working on to achieve a common goal, we define how we want to get there.

Last but not least and maybe most importantly when working across different companies and disciplines, different organisational structures, individual needs are to be taken into consideration.

Not every company is set up to run agile sprints, and not every project can afford a lengthy step-by-step process in a fast-paced market.

Summary & Closing thoughts

The HV Project Model is a way of reducing complexity, approaching challenges and bringing people on the same page to hopefully solve problems and create great solutions for the people that eventually use a product by asking three questions at the beginning of every project:

We do not believe in one way of doing this. Things constantly change, and we adapt accordingly. As a set of rules, we try to keep in mind that this model is…

  • NOT THE model but A model.
  • NOT a process but a basic framework.
  • NOT static but dynamic.
  • NOT finite but circular.
  • NOT a final set of rules and guidelines but an anchor to always bring along and hold on to when needed.
  • NOT perfect but here to be challenged and improved.
  • NOT & never finished…

Cheers for reading, disagreeing and sharing your thoughts or maybe even this article if you have enjoyed reading this far.

If you would like to read more from Hinderling Volkart and our team, follow our publication: https://medium.com/hinderlingvolkart & 👏🏻

Credits go out to the entire team and all members of Hinderling Volkart that have collaboratively developed this model and keep doing so. Special credits to Claudia Widmann-Camenisch who is now leading change at https://tjikko.io with Christian Stocker and originally initiated and institutionalised the HV Project Model at Hinderling Volkart. Icons used in visualisations are by Icons8. Thx.

--

--

Dan Nessler
Hinderling Volkart

Self-employed Design Lead. Here to spark joy 🤗 & open 4 biz.