We give your product the strategy, hard work and support it needs to win on any platform.
With a focus on user research in the beginning, we create a user experience that stays human centered from design through development. Through all phases our process remains highly collaborative and iterative to adapt to your project needs.
Our Process
Phase 1: Discovery
There is no user experience without the user. This part is all about requirements gathering customer research.
Before we start designing anything, we get to know you, your teams, your product realm, and your user.
We emphasize qualitative user research because we want to solve the right problem the right way.
More
Heuristic Review & Workshop Session
If there is an existing product we recommend to start with a heuristic review, or a usability inspection of the current product. This helps us to identify obvious usability problems with the customer experience. The best way to conduct this step is for our design team to go through the process as a potential new client or customer.
Regardless, we always conduct a short series of internal workshop-like meetings with client stakeholders and subject domain experts.
Workshop sessions should include reviewing existing requirements with your team, including notes and verbal conversations, to understand the product's problem domain and to complete a mapping of the end-user journey.
Interview Sessions and Summary & Recommendations
There is no USER EXPERIENCE without the USER—your customers and your internal team members. We advocate for qualitative research, done one-on-one with the following population groups:
Group 1, your people: Product owner as well as people responsible for sales, account management, and customer service.
Group 2, your customers: Your clients or customers, preferably individuals involved in the buying process.
Together, these groups provide an unvarnished view into how the products work today, as well as highlighting differences on how your product is perceived from both inside and outside of the organization.
Finally, we conclude Phase 1 with a summary presentation of observations, supported by a highlight reel from interviews, as well as concrete recommendations for next steps.
Relevant Case Studies
We began with a heuristic review of Sidewalk Dog’s current site analyzing desktop and mobile patterns, researching other directory patterns, and digging in to site analytics. Armed with this analysis, we created a happy path prototype that applied our recommendations: design for mobile retention and decrease bounce rate, both which became target goals for the subsequent design stages. Full Case Study
For Get Like Me, the Requirements Gathering & Customer Study Phase was crucial. We started with a feasibility study, which is similar to Phase 1 of our process, to see how we could realize the vision of projecting an avatar over / near an actor. We started down one path and quickly pivoted our client in another direction based on the results of our technical feasibility analysis. The result was a revolutionary marketing tool for use on social media platforms. Full Case Study
NECPRS’ perception of what needed to be re-designed changed after our initial user study and heuristic review. One of the biggest findings was the need to enhance the training calendar and course discovery process - a key success scenario that was not top-of-mind for the client at project’s start. The result was a dramatic uptick in reported site usage and satisfaction from early childhood care providers. Full Case Study
We interviewed Orange Tree sales professionals and reviewed sales call recordings to learn the process and strategy for diagnosing the right collection of services and risk mitigation for each client. This variation of a user study resulted in a step-by-step pattern to build background screening solutions, which educated users about the components of a successful background screening solution. The result was a first of its kind solution for making an apples-to-apples comparison of packages and contributed to Tonka Bay Equity Partners LLC investing in Orange Tree. Full Case Study
Phase 2: Define
The “how it actually works” part. The feature set and workflow.
A correct, prioritized feature set is paramount to designing a winning customer experience.
A simplified workflow is a key step in designing a rewarding customer experience.
Choosing the right tech stack - what software frameworks and cloud services will be the right fit.
More
Feature Set
A secondary outcome from the Phase 1 Customer Study will be a prioritized set of features. These are required to define the customer journey as they interact with your product.
A correct, prioritized feature set is paramount to designing a winning customer experience.
Workflow
A simplified workflow is a key step in designing a customer experience that is rewarding and generates positive word-of-mouth referrals. It is a roadmap to how users will navigate through the app.
Sometimes the product’s features and content are in-sync with customer expectations, but the workflow does not match an expected mental model. Translation: the app experience may be less than satisfactory because of the steps required to perform an important task.
A well-mapped workflow is the base of a successful product.
Tech Stack
A tech stack is the combination of technologies used to build, deploy, run, and maintain an app or service. A tech stack typically consists of programming languages, frameworks, a database, front-end frameworks, back-end services, and applications connected via APIs.
Where possible, we favor a low code approach, which means assembling services from existing cloud platforms. This reduces development risk, as well as time and cost. We have built great solutions for clients using Content Management Systems (CMS), like Squarespace and Shopify, while pairing with back-end cloud providers like Google Firebase and Amazon Web Services. We have used Airtable, Typeform, and Retool to deploy the Admin Dashboard for apps. We favor Stripe for payment processing, where needed, and have used DocAssemble to build sophisticated document management apps.
A thoughtful Tech Stack makes your app come to life with minimal risk and maximum gain.
Relevant Case Studies
We performed extensive user research, interviewing study staff and clinical care coordinators. Working with a small team, KRUTSCH iteratively mapped out a comprehensive workflow to digitally implement the customer journey, across multiple user roles, through the entire clinical trial process. The result was a highly successful product launch with the Mayo Clinic Cancer Center, with overwhelmingly positive feedback from a world-wide user population. Again, the client’s vision started in one place and moved to its release state based on our extensive user study and workflow analysis, focused on bringing a digital transformation to a user population rooted in a paper-based world. Full Case Study
A classic example of taking an idea and turning it into a series of patented solutions. What started as a simple video chat function, See A Star has turned into a white labeled solution for sports marketing, fantasy sports, and sports betting. This came about as a result of KRUTSCH’s relentless pursuit of feature set and workflow analysis, tuned through a series of live trials and pilots. Full Case Study
When we conducted the feasibility study it revealed what was possible, both technically and from an App Store review process standpoint. What started as an app to block phone calls and text messages, dont turned into a patent pending, parent-teen monitoring and reporting system. Full Case Study
Phase 3: Design & Prototype
Watch your app visually come to life.
Sketch-style wireframes implement established features and workflow.
Using our Patterns, we iterate concepts until we have a workable design model.
This translates into one of two types of interactive prototypes: storyboards or reference pages.
We run an initial user test to identify any usability problems hiding in the prototype, predicting your customer’s satisfaction with the developed product.
We start on the back-end, developing prototype code to make sure we understand how to address any challenges that lie ahead.
More
Iterative Design
We understand the main success scenario is to provide a compelling experience for your product. To that end, we build out sketch-style WIREFRAMES for a user interface and interaction model that implements the features and workflow from Phase 2.
We have achieved remarkable results with earlier clients, getting an early preview and giving candid feedback, even only using sketch-style wireframes.
Option 1:
Interactive Prototype - Storyboards
Wireframes, a visual language and best-fit technology come together into a HI-FIDELITY PROTOTYPE built as an interactive front-end — we call these “Storyboards”. Using tools such as Adobe XD and Figma, we approximate the end-user experience with high-fidelity tools that allow you to view and understand a representative product experience.
Option 2:
Interactive Prototype - Reference Pages
Wireframes, a visual language and best-fit technology come together into a HI-FIDELITY PROTOTYPE built as a working front-end—we call these “Reference Pages” and demonstration, back-end code (i.e. canned data in a demo server system that approximates a subset of functions of the full-featured product platform).
Relevant Case Studies
Note: these are examples of how iterative design and prototyping created a better product development experience for our clients.
DaVinci + Mayo Clinic - Our team of seasoned user interface developers built a working set of “Reference Pages” (i.e. working web app) that the client’s own development engineers merged into a newly developed back-office system, as features were being developed. Using our working “Reference Pages” we were able to conduct usability studies ahead of full feature implementation by the client’s product team. Full Case Study
Parsec Labs - We performed the initial user experience research, interviewing field sales engineers, followed with iterative designs, co-developed with product owners. Our team of seasoned user interface developers built a working set of “Reference Pages” (i.e. working web app) that the client’s own development engineers merged into the device’s embedded system, as features were being developed. This project demonstrates our deep expertise in storage and networking. Full Case Study
Phase 4: Develop & Deploy
We’re finished strategizing, and the “how” is done.
Now it’s time for the “what”. And to make sure your customers love it.
We provide front- and back-end development services, product testing, bug fixes, and cloud services and/or app store deployment.
We run a second user test to identify any usability problems, collect qualitative data, and to determine your customer’s satisfaction with the product.
And because the legal stuff matters, we can help with that, too.
Finally, we provide a variety of frameworks for Ongoing Support, post deployment. Book an appointment we will tell you what’s worked for our clients.
More
What follows the prototype is deployment of a front-end for live use (optionally a back-end development for the cloud-hosted platform) and end-user testing.
In some cases, support tools (e.g. an Admin Dashboard) are required to support live deployment. This allows your product to scale both vertically (number of supported features) and horizontally (expanding beyond the initial use cases and supporting a larger number of user groups).
Production-grade code will robustly run and be deployed to manage many simultaneous scenarios, when extended and hosted on a commercial cloud platform.
Going from concept to delivery, on-time, and on-budget, requires a lot of compromise. As partners, we ensure your vision comes to life efficiently and accurately. KRUTSCH will act as a seasoned advocate for your customer’s experience.
Relevant Case Studies
Dont - Native apps were built for Android and iOS. Our mobile platform and back-end developers closely collaborated to create cohesive builds, ensuring easier app management. Rigorous testing honed the state detection and monitoring logic, deemed so crucial during the feasibility phase. This app represents an example pf KRUTSCH’s work with Research and Development style apps that push the boundaries of device systems and hardware capabilities. A challenging project, we helped our client realize their vision in a patent-pending, user driven, app store acceptable form. Full Case Study
Orange Tree - Orange Tree’s Build Your Own Solution web app offers an industry leading solution for background screening education and comparison, while reinforcing their core values: compliance, technology, and customer service. In addition to content development, we designed interactive visual features highlighting how service selections affect the risk level of a solution. KRUTSCH worked closely with Orange Tree's internal development team to integrate our tailored front-end user experience and back-end software with Orange Tree's existing infrastructure. Full Case Study
Want to know how our process helps your project?
All you have to do is get in touch.
We will walk you through a model tailored for your needs with timeline and cost estimates.
Still Curious?
Check out our blog posts about our UX design process life-cycle, from understanding the problem to delivering the design.
