Qídé Studio

Diverse Minds. Designing Tomorrow.

Creative technology workspace showcasing modern design tools and innovative projects

arrow_forward WebGL Code Editor

Latest News

Modern university library building with a multi-colored facade featuring red brick, beige stone, and green architectural elements against a clear blue sky. The three-story structure showcases large glass windows and a contemporary design, with landscaped greenery in the foreground and mountains visible in the background.

Michail Semoglou Appointed Visiting Professor at UoI

Our studio lead joins the University of Ioannina’s School of Fine Arts as a visiting professor, teaching Creative Coding and Advanced Generative Design for Artists. This appointment strengthens our academic ties while advancing innovative approaches to computational aesthetics in fine arts education.

Projects

Web Design and Development

A minimal mind map visualization showing two blue circles connected by a straight line.

XOR Nexus: Logical Thought Mapping

Advanced mind mapping application integrating dynamic graph visualization with intuitive controls. Empowering researchers and professionals to explore complex relationships through interactive node manipulation, hierarchical organization, and real-time collaborative features. Export capabilities support seamless academic and professional documentation.

View Web App
Screenshot of a minimalist mobile app interface for Daily Tasks. The screen shows a white iPhone-style device against a black background. The app displays the title Daily Tasks, followed by a subtitle Finding Beauty in the Mundane: A Poetic Ode to Daily Tasks.

Daily Tasks

Efficient todo app with priority sorting, due dates, and local storage. Features include filtering, text export, and customizable views. Perfect for professionals seeking a streamlined approach to managing daily tasks and long-term goals.

View Web App
Screenshot of a mobile app interface for 'Markdown Studio' version 1.3.1. The screen shows a white iPhone-style device against a dark background. The app displays input fields for 'Document name' and 'Tags', a blue 'Save' button, and a message stating 'No saved documents yet.' beneath an empty list area for 'Saved Documents'.

Markdown Studio (1.3.1)

Advanced Markdown editor with real-time preview, custom CSS, and multi-format export. Features include task lists, footnotes, and emoji support. Ideal for academics and professionals seeking a powerful, customizable writing tool with secure local storage.

View Web App

Web Tools

Circular gradient transitioning from blue to green, yellow, and red against a black background, with a red 'NEW' badge in the upper right corner.

WebGL Code Editor

Explore WebGL programming with our interactive code editor. Transform 3D graphics concepts into dynamic visualizations using this powerful educational tool. Perfect for researchers, designers, and students investigating computational graphics. Experiment, learn, and create with real-time feedback.

View Web Tool
A black background with a dynamic 3D particle animation showing a fragmented image composed of small white and light blue dots. The particles appear to form a rectangular shape floating in space, with varying depths creating a sense of dimensionality and movement. The effect demonstrates Particle Nova's ability to transform 2D images into interactive 3D particle displays.

Particle Nova

Transform static imagery into dynamic 3D particle animations with our WebGL-powered visualization tool. Featuring real-time particle manipulation, multiple explosion effects, shape variations, and duotone color controls, this application empowers artists and researchers to explore the intersection of traditional imagery and generative art. Export high-resolution stills or record fluid animations for academic and creative projects.

View Web Tool
A stylized letter 'A' composed of red dots on a black background. The letter is formed by a pattern of small illuminated points, creating a 3D effect. To the right of the 'A' is a smaller, similarly constructed plus sign (+). The bottom of the 'A' transitions from red to blue dots, adding a gradient effect.

C0SM1C SCR1P7 0x6E

Advanced 3D text visualization tool leveraging WebGL and p5.js. Explore dynamic point cloud animations with precise control over typography, camera dynamics, and color gradients. Ideal for researchers and designers investigating spatial typography and generative art.

View Web Tool
A vibrant repeating pattern of small red circles on a bright pink background. The circles are arranged in a grid-like structure, creating a bold and eye-catching geometric design.

Pattern Creator (1.1.1)

A sophisticated p5.js-based tool for generating customizable, multi-layered geometric patterns. Ideal for designers and researchers exploring visual complexity, symmetry, and color theory. Export high-resolution images for academic or commercial use.

View Web Tool
Abstract, colorful waveforms and geometric shapes dynamically responding to audio input, showcasing the p5.js-powered audio visualization tool.

5YN7H 0x1F 2.0

Explore advanced audio visualization with our p5.js-powered application. Utilizing LSTM neural networks and real-time audio analysis, this tool creates engaging, interactive visual representations of sound. It’s designed for musicians, designers, and researchers investigating the convergence of audio and visual aesthetics.

View Web Tool
A highly pixelated, colorful image showing a recognizable scene or object, demonstrating various levels of pixelation and vibrant color modes of the 0xDRMY PXL5 tool.

0xDRMY PXL5 (1.0.1)

0xDRMY PXL5 camera captures into pixelated masterpieces. Featuring adjustable pixel size, color modes, and high-resolution output. Ideal for digital artists and researchers exploring image discretization. Experience precision imaging at the intersection of art and technology.

View Web Tool
A highly pixelated image featuring a custom geometric shape, showcasing the precision and creative possibilities of the pixelation engine.

Pixel Art Editor (1.1.1)

Transform images with precision using our state-of-the-art pixelation engine. Featuring customizable shapes, dynamic text integration, and real-time editing capabilities, this tool empowers artists and designers to create stunning pixel art with unparalleled control and efficiency.

View Web Tool
Interactive HSB color grid displaying a range of hues, saturations, and brightness levels. Highlighted sections indicate optimal color choices for contrast and legibility, with real-time WCAG compliance indicators.

Chroma Gridlock

Optimize visual design with our precision HSB color grid. Analyze contrast ratios, WCAG compliance, and typography legibility in real-time. Elevate your projects with data-driven color selections for enhanced user experience and inclusivity.

View Web Tool
Interactive display of a harmonious six-color monochromatic palette, with each color swatch accompanied by its hex code. A central hue selector allows real-time palette adjustments.

Pop

Elevate your design process with our dynamic p5.js monochromatic palette generator. Instantly create harmonious six-color schemes, complete with hex codes. Our responsive design adapts seamlessly across devices, while easy palette saving streamlines your workflow. Harness the power of computational color theory to transform your projects.

View Web Tool
Circular color wheel displaying a full spectrum of hues, with adjustable sliders for saturation and brightness. Selected color is prominently shown with its HSB values.

Color Lab 2.0

Explore color theory with our interactive color spectrum analyzer. This tool allows adjustment of hue, saturation, and brightness in a visual format. Useful for designers, students, and anyone interested in understanding color relationships and their practical applications.

View Web Tool
Animated display of two large color swatches side by side, showcasing complementary color pairs that change every two seconds. Each swatch is labeled with its corresponding hex code.

Defying Entropy

Our algorithm creates complementary color pairs, updating every two seconds. Visualize color relationships instantly, with hex codes displayed for easy implementation. Perfect for designers seeking inspiration or researchers studying color theory. Expand your chromatic horizons effortlessly. Experience the dynamic interplay of hues in real-time.

View Web Tool

Open Source

(Image) Color Analysis Tool (CAT)

Advanced Python tool for comprehensive image color analysis. Extract color distributions, calculate harmonies across RGB/CMYK/HEX formats, and detect dominant colors. Perfect for designers and researchers exploring color theory, offering precise sorting by frequency, hue, saturation, or brightness with detailed reporting capabilities.

View on GitHub
Side-by-side comparison demonstrating the Enhanced Image Processor's capabilities. The left panel labeled 'Original' shows a textured concrete or plaster surface with subtle variations in gray tones. The right panel labeled 'CLAHE Enhanced' displays the same surface with significantly improved contrast and detail visibility, revealing intricate texture patterns and depth previously obscured in the original. This visual comparison illustrates the effectiveness of the CLAHE algorithm for image enhancement while preserving natural appearance.

Enhanced Image Processor

Advanced image processing library utilizing CLAHE algorithm for precise contrast enhancement. Combines automated parameter optimization with multi-color space support, delivering superior results for both academic research and professional visual applications.

View on GitHub
Two side-by-side screenshots of a 'K-means Clustering for Visual Abstraction' application window. The left image shows a grayscale cityscape of Shanghai with skyscrapers and a river. The right image displays the same scene abstracted into horizontal bands of varying shades of gray. Both windows have a slider at the bottom labeled 'Clusters: 5'.

K-means Clustering for Visual Abstraction

Advanced image processing tool leveraging k-means clustering algorithms for visual abstraction. Dynamically reduce image complexity while preserving key visual information. Ideal for researchers and designers exploring computational aesthetics and data-driven image analysis.

View on GitHub
A grid of four images showing the same colorful scene, each simulating a different type of color vision deficiency.

Types of CVD Simulator App

Our Color Vision Deficiency Simulator enables designers and researchers to experience the world through various visual perspectives. By employing advanced algorithms, we support inclusive design practices, aiming to enhance digital accessibility for millions globally.

View on GitHub
Skyline of modern city skyscrapers. Below the cityscape are four color swatches extracted from the image: light blue, dark green, medium gray, and light gray.

Color Palette Extractor

Advanced chromatic analysis tool for design professionals. Extract dominant colors, generate harmonies, and produce detailed reports. Elevate your design process with precision color data across branding, web design, and visual arts. Bridging color theory and practical application.

View on GitHub
A four-quadrant color display showcasing variations in hue, saturation, and brightness. The top-left quadrant is bright magenta, top-right is deep red, bottom-left is vivid pink, and bottom-right is bright red, demonstrating the tool's ability to visualize color relationships.

Chromaso

Explore the intricate relationships between hue, saturation, and brightness with Chromaso. This sophisticated Processing-based application offers real-time color palette generation, empowering designers and researchers to delve into chromatic theory and its practical applications.

View on GitHub
A split-screen image demonstrating the duotone effect. The left half shows a deep teal color, while the right half displays a soft peach tone, illustrating the tool's ability to create striking two-color compositions from original images.

Duotone Image Generator

Elevating visual communication through advanced image processing. Our duotone generator transforms ordinary images into captivating, professional-grade visuals. Explore the power of color theory and computational aesthetics to enhance your visual storytelling and brand identity.

View on GitHub

Expertise

Qídé Studio integrates industry expertise with academic research. Our team comprises specialists in branding, technology, filmmaking, and design, offering a multifaceted approach to each project.

Services

We provide a wide range of creative and technical services, offering customized solutions in visual communication, brand strategy, and interactive design. Our expertise encompasses advanced technologies and artistic practices. We develop immersive digital experiences, craft brand narratives, and create data-driven visual systems, adapting our approach to each client’s specific requirements. Our team combines aesthetic refinement with technological innovation to expand the boundaries of creativity and functionality in every project.

Academic Contributions

Our academic engagement is led by Michail Semoglou, a Research Associate at the Branding Public Space Lab within Tongji University’s College of Design and Innovation in Shanghai. His work integrates theory and practice, enhancing both our studio projects and the wider design field. Michail contributes to design education through courses on Branding in Communication Design Systems and Creative Coding for graduate and undergraduate students. He organizes an annual symposium exploring the intersection of branding public space and emerging technologies. Michail also conducts lectures and workshops across China, covering topics such as generative design, data-driven branding, AI in creative processes, parametric typography, interactive storytelling, sustainable design, public space activation through technology, and XR in communication design. This academic involvement keeps Qídé Studio at the forefront of design theory and practice, informing our projects with current insights and methodologies.

Open Source Contributions

Our strategic open-source initiatives advance computational design through specialized tools for visual analysis and creative coding. We’ve developed sophisticated solutions including our Enhanced Image Processor with CLAHE algorithm implementation, CVD Simulator for accessibility testing, and Color Palette Extractor for chromatic analysis. These tools exemplify our commitment to merging theoretical research with practical applications, fostering global collaboration while maintaining cutting-edge expertise in the intersection of technology and visual design.

Get in Touch

Collaborations

We welcome collaborations on innovative projects. For inquiries about commercial partnerships, please contact us at hello@qide.studio. Our team is ready to discuss how we can realize your ideas.

Research

To discuss potential collaborations on research or experimental projects, please contact Michail Semoglou directly at m.semoglou@tongji.edu.cn. We are keen to explore advanced concepts and extend the limits of creative technology.

Careers

Although we don’t have current openings, we continuously seek innovative and committed individuals for our team, including internship positions. We encourage applications from those with basic to intermediate programming skills in JavaScript (including vanilla JS and p5.js), Java (Processing), and Python. Candidates should also possess advanced abilities in Latin and Chinese typography design, along with strong English language skills. To apply for employment or internship opportunities, please submit your CV and portfolio to jobs@qide.studio. We appreciate your interest and look forward to potentially welcoming you to our creative community.