Interactive agency + Marketing agency = Two Colours

About the project

The Self-Presentation Institute targets entrepreneurs, personal brands and investors who want out-of-the-box solutions that deliver immediate results. When designing a logo and website for them, we focused on a clear message and unconventional design to fully reflect the spirit of their business.

We invite you to explore the process of creating a logo and website for the Self-Presentation Institute.

Project authors
  • Łukasz
    Senior Graphic Designer
  • Dawid Kotrys
    Owner, creative director
  • Mateusz
    UX designer
Prototype

Creating a prototype - a mock-up of a website

The creation of a business card site for the Self-Presentation Institute began with the creation stage of the initial design, namely. prototypeInstead of dealing with detailed graphics right away, we focused on simple visualization, so that we could have a secure and solid base for further activities first.

During prototyping, we use tools such as Miro and Figma. They allow us and our clients to view and customize the total structure of the site, from the home page to all subpages. During this time, we indicate suggestions for the placement of various sections, text, images and CTA buttons.

When creating the website for the Self-Presentation Institute, our priority was to present the offer in the clearest and most intuitive way possible. We aimed to make it easy for users to find everything they need and to get a more detailed look at the offerings presented by architects. We have included various methods of presentation - from textual descriptions to portraits of professionals offering services.

A key part of the process of creating all pages is working closely with the client. After completing the first version of the design, we held an online meeting to discuss our ideas and provide guidelines for possible changes and improvements.

Business card page prototype

Graphic design of business card page and logo

In addition to creating the website design, we were also tasked with designing a logo for the brand. A logo is a key component of any company's visual identity. We drew inspiration for the logo primarily from the brand name itself and the fact that its specialists are referred to as "architects." The result is a sigil based on the acronym "IA." The form of this logo is mildly abstract, a reference to the world of architecture and the architectural profession, but in the context of creating a self-presentation.

We paid special attention to the letter "A" - Separated from the letter "I", it resembles the number "1", which is supposed to symbolize innovation and being the best in the field. In contrast, the letter "I" is meant to represent the human aspect of the Institute. It looks like a silhouette of a person, on which the letter "A" rests - symbolizing self-presentation. The key message is that the Institute's people are the foundation of any successful self-presentation, they are its strength and guarantee of effectiveness.

The design assumptions and symbolism of the logo were then adapted into the design of the website to make the entire visual brand identity consistent and coherent.

Home page business cards for your company
Business card website design

As for the graphic design of the site itself - upon first entry, the visitor's eyes are immediately drawn to the hero section with high-quality video content. It is here, thanks to a drop-down list, that the user can instantly jump to a tab introducing specialists who are willing to help with the task at hand. Such quick access to key information ensures that a potential customer not only quickly finds what he or she needs, but also has the opportunity to learn more about the offer. We designed the CTA buttons on the homepage and subpages to be highly visible and distinguished by color.

The unique design of the site cannot be passed by indifferently. Dominant shades of navy blue and purple harmonize with graphic accents, such as icons, frames and geometric elements, adding a unique character to the site. One of the most intriguing elements are the neon effect numbers and frames, which look as if they are gently glowing, spreading pink light around them. Such a treatment resembles the neon effect on a building, giving the site a modern vibe.

Importantly, the developers of the site have taken care to portray the real faces of professionals. In the digital age, authenticity and transparency are becoming key to building trust. That's why each specialist has an individual post, where you can learn more about their experience and skills, as well as contact them directly through the form.

Implementation

Coding a business card page

Implementation of the website The business card was an important element in the creation process. For this purpose, we used a Page Builder tool called Elementor, which has gained popularity due to its flexibility and ease of use. Elementor not only facilitates the work of developers, but also allows customers to make changes to the site themselves. Clients can adjust content on an ongoing basis to meet rapidly changing market needs and user expectations, without having to constantly contact the agency.

During the coding stage, we focused on adding key features that would have a real impact on achieving the site's business goals.

Form for generating leads

We have introduced a form that allows users to sign up for the mailing database. This is an important element in the process of building relationships with potential customers. In exchange for providing their email address, users receive a free e-book.

Mailing database sign-up form with free e-book

Contact form

We implemented contact forms in the contact tab and next to each post describing a specific specialist.

Contact form on the company's business card page
Contact form on the Self-Presentation Institute website

Did you like this project? Visit our profile on Behance, to see it in all its glory, and learn more about our other realizations.

If you dream of a unique and professional website, don't be shy and make an appointment to free consultation

    Let's talk and establish action plan!

    Krótki formularz Fill out the full brief

    Hidden
    Hidden
    Jak Ci się to podoba?