CRIS/OS · SYSTEM + AI LAB

Design decisions turned into observable architecture.

This lab separates three topics that competed for attention on the Home page: the Design System, the multi-framework strategy and the evolution toward AI-assisted products.

The Artificial Intelligence specialization has been in progress since August 2026. The following lines are explorations and roadmap items, not completed professional experience.

← Back to portfolio

01 · DESIGN SYSTEM

A shared language between intent and execution.

CRIS/OS works as product infrastructure: it defines reusable decisions, reduces ambiguity and connects design, content, accessibility and code.

01 / 03

Foundations

Shared rules that give the interface consistent rhythm, contrast and behavior.

  • Semantic color
  • Fluid type
  • Spacing
  • Grid
  • Motion
02 / 03

Tokens

Variables that express intent and allow themes to change without coupling components to visual values.

  • Primitive
  • Semantic
  • Component
  • State
  • Theme
03 / 03

Components

Documented UI contracts covering purpose, API, content, keyboard and edge cases.

  • Button
  • Navigation
  • Card
  • Dialog
  • Chat
cris-os/tokens.semantic.css
--color-action-primary: var(--primitive-green-300);--color-surface-raised: var(--primitive-neutral-900);--color-border-focus: var(--primitive-yellow-300);

Implemented in this prototype

02 · FRAMEWORK STRATEGY

Three technologies, three clear responsibilities.

Versatility is better demonstrated through sound decisions than by loading three frameworks into one view. Each demo will be isolated, measurable and removable.

01IMPLEMENTED

Vue / Nuxt

Editorial shell

Bilingual content, SEO, navigation, Design System and static generation.

Current production
02ROADMAP

React

Agentic experiment

Conversational UI, sources, traces and response evaluation.

/lab/react
03ROADMAP

Angular

Enterprise flow

Rules, forms, tables, validations, states and approvals.

/lab/angular

03 · AI SPECIALIZATION PATH

Learn, prototype, evaluate and document.

The specialization will progressively become public evidence through small experiments, reproducible cases and responsible evaluation.

EXPLORING

AI Product Design

Expectations, human control, explainability, trust and error recovery.

Next deliverable: UX heuristics for Ask Cris.
ARCHITECTURE

Agents + RAG

Structured sources, cited retrieval, tool boundaries and answers that acknowledge uncertainty.

Current base: local fallback grounded in public sources.
ACADEMIC ROADMAP

NLP + automation

Intent classification, responsible extraction and automation of repeatable tasks.

TODO: define exercise, dataset and evaluation criteria.
ACADEMIC ROADMAP

Computer vision

Exploring visual accessibility, classification and graphic asset analysis.

TODO: scope a case without sensitive data.
PRIORITY

AI evaluation

Test sets, source precision, abstention, safety, cost and user experience.

Next deliverable: an eval matrix for Ask Cris.
CROSS-CUTTING

Responsible AI

Privacy, data minimization, transparency, human oversight and risk analysis.

Guardrails documented before integrating a real API.

Nothing is presented as a professional result until evidence, context, tests and publication approval exist.