Tempus Creative

Helping an agency attract clients by merging a design portfolio with an e-commerce knowledge center


4 weeks - 2022

My Role:

UX/UI Designer

Featured Skills:

Concept UX design
Visual UI design
Usability testing


Stephanie Larson
Garrett Hoffmann
GeeYun Chae

Client Website:


Skip to Final Designs


The Client:

We worked directly with Jared Knapp from Tempus Creative, a design agency focused on helping businesses achieve their design goals. They offer creative experiences, marketing strategies and design services to amplify client brands and drive growth.

Project Status:

This agency had attracted many of their client work through networking and wanted to redesign their existing website to start attracting a broader audience. I and my teammates were brought on to help with the website redesign.

Design Challenge:

Create a desktop website that showcases both the design services Tempus Creative can offer and branded e-books that can help clients learn about design on their own. A combination of a design portfolio and a self learning knowledge center to attract clients of varying design goals and budgets.

Outcomes & Learnings:

We delivered a competitive anlaysis along with two iterations of designs with usability test data. The client was happy with the work and was excited to use it as a starting point for their redesign endeavors. I gained experince in working collaboratively as a team and learned more about creating designs that meet both customer and business needs.

"Amelia assisted my company with a web overhaul combining both an existing sales funnel with common practice e-commerce. Ultimately providing a balanced solution that allows our customers to choose between our product and service offerings. I can confidently attest to her ability to thrive in unknown territory. I witnessed her adapt to the unique request with professional execution."

-Jared Knapp
Founder of Tempus Creative

Project Journey

The Context
Client Design Brief
Competitive Analysis
Ideate & Design
Site Map
User Flows
Test & Iterate
Usability Testing
Design Iterations
Prototype in High Fidelilty
High Fidelity Designs
Project Reflections

The Context

Screenshots of existing website
Scheduling poll for project coordination

Listening to the Client

Prior to meeting with the client (Jared) I tried to learn as much in advance about the company, their values and who they catered to. During our kickoff call it was great to hear Jared articulate what his goals were for the project and any constraints he knew of.

What I Did

I sent out a scheduling poll to my teammates since we were working across three different time zones. I reached out to Jared about setting up a project kickoff call and lead the meeting by asking the questions that myself and my teammates had prepared.

Merging a Portfolio and E-commerce Knowledge Center

We learned that Jared wanted to redesign the Tempus Creative website to attract more clients. He wanted to showcase past design work the agency had done. Along with this he also wanted to sell e-books about design and marketing on this website. His goal was to appeal to clients who may not be interested in design services and would prefer to learn how to do things on their own.

Reviewing Other Successful Websites

As a team we performed a competitive analysis to see what has been successful and what to avoid for both design agency/portfolio and e-commerce websites. We assessed 16 websites in total and scored each site based on 3 of Jakob Neilsen’s usability heuristics.

What I Did and Learned

I assessed 5 websites on my own.  I specifically tried to find websites that sold digital products and presented themselves more as an online resource center vs websites that represented a brick and mortar store.

Across all the websites I learned how important it is to have a clear and easy navigation. Also, that social proof is key to building trust, especially when buying a digital product like an e-book.

Screenshots  of competitor websites to review
Overview of websites reviewed

Design & Ideate

Redesigning the Information Architecture

We mapped out the existing site structure just to assess the current condition. We initially proposed to divide the website into three sections: portfolio, services and resources. With continued iterations we discovered that having only three sections was too broad. To alleviate the mental load, we expanded to show more options upfront for people to choose from.

Thinking Through User Flows

With our site map established we initially built out 4 user flows. These eventually became 3 user flows since we realized that the experience of searching for e-books was the same for new customers as it was for returning customers.

What I Did and Learned

I specifically worked on user flow #1, the experience a new prospective customer would have as they looked at past work done by Tempus Creative. These userflows helped me think about who would be visiting this agency website and what their goals were. It forced myself and my teammates to define and prioritize the main call to action we wanted highlight.

Turning Sketches Into Wireframes

The user flows helped us know which screens would need to be designed. I sketched and did some wireframe options for the portfolio page. We worked together to form a wireframe prototype to test with others. I specifically helped with the e-book page and overall prototype animations.

Home Page
Services (Hire)
Resources (Learn / E-Books)

Test & Iterate

Seeing Reactions From People

As a group we conducted 5 moderated usability tests. 3 people with UX backgrounds and 2 people who were business owners who have previously searched for design services. We were eager to learn about the success rate of our information architecture, initial impressions of the Tempus Creative brand, and thoughts on the e-book/learning resource section. We timed how long it took for people to perform each task to establish a benchmark to help validate future design iterations.

Usability Testing over Zoom

What I Did and Learned

I conducted 2 of the usability tests. From all the testing data I learned that:

  • It’s hard for people to imagine designs in wireframe form. Choosing the level of fidelity is important, along with allocating time for explanations is key.
  • People appreciated the clean and organized designs but still wanted more personality behind the brand.
  • Microcopy like the “resources” category confused people and we could do better to define the difference between the “hire” and “learn” options.

Presenting Our Work

We presented all our progress work to the client.
Our slide deck included:

  • Site map
  • User flows
  • Wireframes
  • Usability test findings

What I Did and Learned

I specifically formatted and presented slides explaining our usability testing methods and findings. I also lead the wrap up portion of the meeting. I confirmed our next call with the client, next steps and any lingering questions.

Iterating on Designs Based on Feedback

Jared was happy with the progress we had done so far and was excited to see our next design iterations. Jared shared new ideas he had for his website along with more detailed information about his e-book sale plans.

Jared wanted the attention to be less about the Tempus Creative brand and more about what customers need. We changed the wording on the home page and prioritized the hire vs learn actions.

It was mentioned that e-books could also be sold in bundles.
We made cards to showcase the e-book bundles.

Jared want to avoid the lengthy contact form. He wanted a quicker way for people to contact Tempus Creative about hiring needs.  We replaced the contact form with a “book-a-call” modal with less typing required to connect with Tempus Creative.

Prototype in High Fidelity

Creating Consistency With a Style Guide

We sketched out new ideas and started forming wireframes when we realized that we needed a style guide to help standardize things. We were ultimately working towards creating high fidelity designs so establishing these rules and styles was super helpful in bringing our designs to the next level.

What I Did:

I sketched out ideas for the home, services and e-book pages. I helped establish consistent typography styles and UI element designs. I helped create the high fidelity versions of the home page, cart pop up, and “book a call” modal. To bring everything together I animated most of the screens together and prototyped specific hover states for buttons and action cards.

Final Designs

Home Page
Book a Call Modal
Checkout Cart Pop-Up
Brand Strategy Service Page
Individual E-book Bundle Page

Interactive Prototype

Project Reflection

We walked our client through the high fidelity designs, and he was inspired by our work.
Throughout this process I’ve learned the importance of sketching/visualizing an idea out. Especially when working with clients, people are so visual and like to see ideas sketched out.

Working with a design team was so much fun. Through collaborating and effective project planning we were able to cover a large scope of work in just 4 weeks.

This project gave me practice in thinking about how designs can ultimately help people make a profit. Creating experiences that help both customers and businesses with their intended goals.

Giving designers more time with a digital inventory
View Next Case Study
Women sitting on steps and smiling at the camera

Let's Talk!

Currently looking for new opportunities with a design team.
Reach out if you:

  • Want to know more about my work and skills
  • Have questions about making a career switch