Datamolino
Case study
Datamolino is an invoice processing software company with over 10 years on the market. The team planned a complete redesign and custom development of their website, which hadn’t been updated in some time. They approached us to lead the project and update their brand identity along the way.
As the company’s key marketing asset, the website needed a refresh. Besides a visual update, Site Project also delivered improvements in web architecture, navigation, and brand messaging, ensuring it aligns more closely with Datamolino’s vision and growth.
Phase one
Initial discussions, research, and audit
We kicked off the project with in-depth discussions with the Datamolino team to understand their objectives and expectations. We thoroughly reviewed Datamolino’s existing visual communication and performed an audit of their website. The website lacked a clear visual language and had a somewhat cluttered appearance. We identified several navigation and structural issues within the website’s architecture as well as inconsistencies in page hierarchy and the use of website modules.
Phase two
Brand sprint workshop
As part of the prep phase, we conducted a half-day brand sprint workshop with Datamolino’s leadership team. The aim was to distill the essence of the brand and outline the trajectory for its future brand strategy. Through structured exercises, we explored the company’s fundamental values, unique selling points, and target audience. This exercise was crucial in shaping the visual language, tone of voice, and copywriting direction, as well as aligning on expectations for the redesign.
Phase three
Exploration and creating stylescapes
Following the brand sprint, we initiated the exploratory phase, during which Datamolino’s new visual identity began to take shape. This phase involved the creation of mood boards, experimentation with various concepts, gathering feedback, and ultimately, the conceptualization of the brand’s new identity.
Logotype refresh
One of the specific requests from the Datamolino team was to retain the original brandmark. Working with this request, we focused on refreshing the Datamolino logo while preserving its brand icon. We updated the logo’s font to align with the typeface selected for all brand touchpoints, ensuring consistency and achieving a more contemporary appearance.
Color palette
To preserve Datamolino’s brand recognition, we refreshed the existing color palette by introducing deeper and brighter hues—adding a more vibrant feel to the brand. When selecting the colors, we ensured that the combinations and color contrasts are easily legible and accessible to all.
Typography
As the main typeface, we chose a free Google Font for practical purposes. Poppins is a versatile, clear, and modern typeface that comes in a variety of weights and styles, making it a flexible choice for creating a strong and consistent visual identity. It has also been designed with accessibility in mind.
Illustration style
For the Datamolino brand, we chose illustrations as one of the most distinctive elements to define its identity. We crafted a custom-drawn illustration style specifically for Datamolino, and along with it a library of custom-drawn illustrations and pictograms, all designed to unify and enhance the website’s visual language.
We aimed to capture the essence of Datamolino’s company and niche accurately. Our goal was to ensure that the illustration style not only resonates with the target audience but also effectively depicts the product and its benefits.
Brand applications
In redesigning Datamolino’s brand identity, we focused on its specific applications and how the Datamolino team will continue to use it across various touchpoints. Our strategy was to develop a brand identity that is flexible and easily adapts to a variety of use cases.
For example, we incorporate illustrations where a more playful style is appropriate, such as on landing pages, merchandise, or social media. However, the identity also allows for a more toned-down and minimalistic look for formal use cases like sales decks or white papers. The brand is versatile yet always recognizable and consistent, regardless of its application.
Brand guidelines
As part of the brand redesign for Datamolino, we delivered a comprehensive brand guidelines document detailing aspects of the new visual identity, including the color palette, typography guidelines, logo usage rules, imagery and illustration usage, and tone of voice guidelines. These guidelines serve as a clear reference for both their in-house team and external partners and affiliates, ensuring that the brand attributes are consistently applied across various mediums.
Phase four
Creating website wireframes
Simultaneously, we began drafting the initial wireframes, focusing on content layout, functionality, and information flow (without yet incorporating design elements).
We developed modular website components adaptable to various content needs and usage contexts, ensuring consistency across different website sections. Compared to the previous layout, we made several adjustments, establishing a clear hierarchy among subpages and modules. At this stage, we also started to draft a preliminary website copy. Through iterative feedback rounds with the Datamolino team, we fine-tuned the wireframes, making them ready for the subsequent stages of the website’s visual and technical development.
Phase five
Messaging and copywriting
This phase involved crafting clear and compelling text that effectively conveys Datamolino’s value propositions, enables visitors to easily access the most important information, and is also optimized for search engines. We revised the existing content from the old website, simplifying the text, crafting catchier headlines, and restructuring the information for better flow. The tone of voice was carefully crafted to reflect the character of Datamolino as a brand: simple, straightforward, no-fluff, yet friendly and helpful. Through several rounds of feedback, we fine-tuned the main messages, ensuring that each piece of copy accurately delivers the message and resonates with the target audience.
Phase six
Web design
Time to finalize the wireframes with design elements. We developed a web design system to ensure all visual components adhere to a specific hierarchy. This system includes a comprehensive library of typography styles to maintain consistency and enhance readability across all pages, vector illustrations, and defined hierarchies for headlines, colors, and paddings, streamlining the development process and simplifying web implementation.
Both desktop and mobile versions of the website were designed and optimized to ensure proper responsiveness across all devices. The final web design is characterized by a clean, human-centric design, with a friendly and approachable feel for visitors.
Phase seven
Implementation
The final stage of the project involved transforming the final web design into a live website. We developed the site on the WordPress platform, featuring custom coding, including a visual editor with an easy-to-use interface. This allows the Datamolino team to effortlessly edit content and create new landing pages.
Each section of the website is uniquely styled and optimized for efficient loading and peak performance. We strictly adhered to the design specifications and conducted comprehensive website optimization, including technical SEO to ensure proper environment settings and full responsiveness.
Next steps
Our collaboration with Datamolino doesn’t end here. A website is never truly finished, as they say, and we’re providing ongoing support to the Datamolino team, managing additional edits, creating new landing pages, and other marketing and branding assets.
Speaking Heroes
Case study
Behind Speaking Heroes is a team of moderators and facilitators who run public speaking workshops where people learn to become more confident speakers, skilled at delivering engaging and memorable presentations or speeches.
The team approached us to create a strong visual identity and design and develop their new website. Our goal was to capture the energy of their courses in their visual communication. We focused on making the brand versatile and easy to use, making sure it could be easily applied across social media, presentation slides, merch, and other brand assets.
Brand identity creation
Speaking Heroes is all about confidence, skill, and—for many—stepping out of their comfort zone. We wanted to translate these emotions into the brand itself. It needed to be a little bold but very professional. Approachable and playful, while maintaining a high level of clarity and functionality.
Logo
The Speaking Heroes logo is the brand’s main identifier, designed for use across nearly all brand applications. It consists of a brandmark and logotype, with the logotype set in Archivo, the primary brand typeface. The brandmark is inspired by a speech bubble, symbolizing communication, dialogue, and the friendly, interactive atmosphere of Speaking Heroes’ workshops. The logo was designed to ensure high legibility, even at smaller sizes, making it effective across both digital and print materials.
Typography
We chose Archivo as the primary typeface for Speaking Heroes. This Google Font features a clean, geometric structure and is modern, versatile, and highly legible. It was also a practical choice–this font is widely accessible, easy to implement, and ensures consistency across all digital and print brand communications.
Color palette
Keeping in mind what Speaking Heroes stands for, we selected a bold neon yellow as the primary color. This bold choice symbolizes the confidence participants gain through the workshops. When paired with secondary gray tones, the neon yellow becomes even more vivid, creating a strong contrast that reinforces the brand’s positivity and energy.
Web design
When designing the Speaking Heroes website, we aimed to balance bold, eye-catching elements with a structured layout, ensuring users can easily find the information they need while maintaining strong visual elements that reflect the branding. A key aspect of the design is the authentic imagery, featuring real photos from past sessions, bringing the workshop experience to life. It's an intuitive, well-structured website that provides just enough information to engage visitors while making course registration effortless.
Implementation
Following the brand identity creation and web design, we were also brought on to handle the implementation of the website. We developed it on WordPress, creating a custom WP template with easily editable web modules.
Additionally, we integrated the site with an online reservation system, a payment gateway, and email marketing software, allowing the Speaking Heroes team to efficiently manage their courses while maintaining seamless communication with participants.
Applications
The result is a cohesive and impactful brand that empowers Speaking Heroes to inspire confidence in their audience while maintaining clarity and usability across all touchpoints.
Vouchers
Social media
Certificates
Client: Speaking Heroes
Visual identity: Tamara Shawkatova
Web design: Tamara Shawkatova
Web development & app integrations: Martin Križo
Logo & visual identity
Brand guidelines
Brand & communication assets
Merchandise
Web design
Web development
App integrations