Saptak Portfolio 2024

Spec UI Design and Design Systems

Speculative work

Modern design practices to enhance my capabilities in the workplace.

Objective

The 'Speculative UI Design and Design Systems' series highlights my ongoing exploration of UI design concepts, Design systems, Micro-interactions, UX motion, Interactivity, Breakpoints and more.

These projects are more than personal exercises; they allow me to experiment with ideas that often inform and enhance my work in my current role. Constantly challenging myself with new design techniques and interactions keeps me motivated and ensures I deliver fresh, implementable solutions to my projects.

It also keeps me aligned with the latest design practices, as I continuously seek to expand my skills and areas of expertise. Recently, I've focused on staying updated in Design Systems, as well as foundational AI tools and applications that enhance modern design workflows.

The 'Speculative UI Design and Design Systems' series highlights my ongoing exploration of UI concepts, including PDP pages, Design systems, Micro-interactions, UX motion, Interactivity, Breakpoints and more.

These projects are more than personal exercises; they allow me to experiment with ideas that often inform and enhance my work in my current role. Constantly challenging myself with new design techniques and interactions keeps me motivated and ensures I bring fresh, implementable solutions to my professional projects.

Foundational knowledge

While I'm not directly responsible for Design Systems in my organization, as dedicated experts lead this area, I have actively contributed to and collaborated on design system initiatives. Through hands-on involvement in various exercises, I've gained a comprehensive understanding of the end-to-end process and its impact on cohesive, scalable design solutions.

These projects are more than personal exercises; they allow me to experiment with ideas that often inform and enhance my work in my current role. Constantly challenging myself with new design techniques and interactions keeps me motivated and ensures I bring fresh, implementable solutions to my professional projects.

Tokens & Variables

I've been exploring the foundational concepts of Design Systems which i'm keen to master.

In this example, I demonstrate how "Variables" and "Design Tokens" are used to set up colors, typography, corner radius, and spacing within a product card.

This approach offers flexibility, enabling seamless transitions between light and dark modes, as well as language changes from English to Hindi.

Light and Dark Mode/Multilanguage Design Token Sample

As I enjoy staying updated, I continuously practice new tools and techniques, creating my own versions to ensure my understanding and hands-on experience remain solid.

Design Practises on UI Design

In these examples, I've showcased a few of my favorite UI design exercises and samples created entirely in Figma. Some have already been used in brainstorming sessions and further implemented in our Pincode app.

Impact

Future-Proofing Design Practices: My personal ventures into design systems, UI design, and new tools have kept me updated with industry trends, ensuring that my design practices are adaptable and scalable for future needs.

Enhanced Collaboration: By sharing my work on design systems and UI concepts, I've fostered better communication and alignment across teams, creating a shared understanding that supports more cohesive collaboration.

Informed Brainstorming: The exercises and prototypes I’ve developed serve as concrete examples during brainstorming sessions, leading to more focused and productive discussions that are grounded in real design solutions.

Increased Efficiency: Practicing and implementing design systems has allowed me to create reusable components, reducing redundant work and enabling faster, more consistent design iterations across projects.