datafirst.store

Tech Company Website Re-Design

I designed Datafirst.store as a modern, single-page corporate website. The goal was to help the company express its vision and solutions with greater clarity.
The site’s conversion-oriented flow guides users through the company’s provided solutions then to take action.
GenAI-generated visuals subtly reinforce Datafirst’s positioning as an AI-driven innovator.

My Role

I led the design and content process for Datafirst.store, focusing on enhancing the site’s clarity, usability, and visual impact. I structured the overall user flow, designed a consistent visual language, and integrated AI-driven content and illustrations to position the brand as a forward-thinking B2B tech company.

Key contributions included:

Project Stack

Figma

I've used Figma for low fidelity wireframes, logo vectorization, and illustration editing.

Photoshop

I've used Photoshop to refine AI-generated illustrations, prepare image assets,

WordPress

I've chosen WordPress as the CMS core, together with the necessary plugins needed.

Elementor

I've used Elementor for visual development and interaction design.

ChatGPT

I've used ChatGPT to generate SEO-optimized text content and to assist UX writing decisions.

Sora

I've used Sora to create AI-generated illustration concepts aligned with the brand style.

Content Strategy & Design Process

During the kick-off meetings, I worked with the founder to redefine both the content and structure of Datafirst.store. We identified key content gaps, clarified the positioning of the company’s services and decided to build the site as a modern single-page application on WordPress. During this process, we defined the target audience as Turkish B2B companies and agreed that all content would be rewritten in Turkish to better resonate with this market. As a result of these meetings, the site architecture and conversion-focused flow were fully shaped, and we proceeded with a low-fidelity wireframe.

Low Fidelity Design

I created a comprehensive low-fidelity wireframe to define the overall structure and flow of the site. The wireframe clearly outlined the main sections, content hierarchy, and user journey — serving as a foundation for visual design and implementation.

The layout included:

  • A hero section for first impressions
  • A brief company story
  • Service sections grouped by topics featuring an image, info text, video gallery (if needed), and a CTA button
  • A reference section with client logos to build trust
  • A clean footer with contact info and a single LinkedIn icon

Our goal was to create a user-friendly and conversion-focused experience, helping visitors quickly understand the company’s services and encouraging them to take action.

High-Fidelity Design

In the high-fidelity stage, I designed the site with a desktop-first approach to match the B2B target audience. I worked in a test environment, allowing for remote review and testing with the client. After a single round of revisions based on their feedback, I managed the final deployment process.

To create a strong tech-focused first impression, I implemented a mouse tracking neural network animation in the hero section background. I then set the system colors and typography to align with the brand identity.

In order to enrich the user journey, I used AI-generated illustrations, Elementor’s motion effects, viewport entrance animations, scroll effects, and subtle interactions across the page. Each service section was structured with a clear content hierarchy, icon-based or futuristic illustrations, elegant and user-friendly video galleries, and CTA buttons. Finally, I carefully optimized the site’s responsive settings to ensure a consistent and smooth experience across all devices.

BEFORE & AFTER

The redesign transformed Datafirst.store from a site with poor content hierarchy and crowded content into a modern, user-friendly single-page experience. The new design delivers clear navigation and a focused user journey — helping visitors quickly understand the company’s services and engage with the content.

BEFORE
AFTER

The Outcome

For me, this project was a valuable opportunity to deepen my expertise in WordPress and experiment with new creative techniques. I implemented vector-based animations for the first time and explored illustration-driven visual storytelling to elevate the user experience. I’m happy that the final result exceeded the client’s expectations — and provided a rewarding learning experience for me as well.

Need a designer who understands both branding and UX?

or

Someone who can bring your web or mobile project to life?

check out my other projects