← All projectsDESIGN IN DETAIL / P083

Configurable exhibition quiz.

A common flow for different physical inputs.

Explore the story
Portrait quiz standby screen with two translucent instruction cards, fish and turtle icons, and a sunset ocean-resort background.
The source-defined quiz standby screen, rendered from isolated HTML, CSS and the native fallback artwork. The fish and turtle instructions are source defaults; no quiz, scoring, physical input, native messaging or functional workflow was exercised.
01 / THE IDEA

A closer
look.

Keep a quiz sequence consistent while accommodating alternative control schemes.

02 / DESIGN APPROACH

From intention
to experience.

A shared application structure covers standby, questions, confirmation and score. The prepared portrait screen explains fish-based selection and turtle-based confirmation.

01

Begin with instructions

The portrait standby layout introduces selection and confirmation as separate actions.

02

Choose, then confirm

The documented flow highlights a left or right answer before accepting a confirmation input.

03

Close the round

The shared specification ends a five-question sequence with a score screen and a return to standby.

03 / THE VISUAL STORY

The work,
in full.

Explore the complete compositions and interface states. Select any image for a closer look.

11 / PROJECT IMAGES

Select a view to explore.

VIEW 01 / 11

Coastal · how to play

Two instruction cards map selection and confirmation to the fish and turtle controls.

Portrait quiz standby screen with two translucent instruction cards, fish and turtle icons, and a sunset ocean-resort background.
The source-defined quiz standby screen, rendered from isolated HTML, CSS and the native fallback artwork. The fish and turtle instructions are source defaults; no quiz, scoring, physical input, native messaging or functional workflow was exercised.
VIEW 02 / 11

Coastal · choose an answer

The question sits above two large answer choices, with a small progress marker.

Coastal portrait quiz question artboard.
Coastal interface variant. The question-and-answer layout retains its source example text and two answer controls.
VIEW 03 / 11

Coastal · result

A translucent panel gives the result its own clear state. Four out of five is sample artwork.

Portrait quiz result artwork with a sample score of four out of five over a coastal resort scene.
Saved quiz result artboard showing the sample score 4/5 over the resort illustration.
VIEW 04 / 11

Urban · question layout

The same question hierarchy is adapted to an urban landscape and green answer cards.

Urban landscape portrait quiz question artboard.
Urban landscape interface variant. The question-and-answer layout retains its source example text and two answer controls.
VIEW 05 / 11

Urban · result layout

A wide translucent result panel leaves the setting visible behind it.

Urban landscape portrait quiz result artboard.
Urban landscape interface variant. The result template displays a sample score of four out of five.
VIEW 06 / 11

Theme park · question layout

Brighter colors adapt the shared layout to the theme-park setting. The native template retains the urban-profile example question.

Theme-park portrait quiz question artboard.
Theme-park interface variant. The question-and-answer layout retains its source example text and two answer controls. The supplied template repeats the urban-profile example question.
VIEW 07 / 11

Theme park · result layout

The result state carries the same translucent treatment into a more colorful scene.

Theme-park portrait quiz result artboard.
Theme-park interface variant. The result template displays a sample score of four out of five.
VIEW 08 / 11

Heritage · question layout

Warm panels and a brown palette align the quiz with a heritage setting. The supplied template retains its urban-profile example question.

Heritage portrait quiz question artboard.
Heritage interface variant. The question-and-answer layout retains its source example text and two answer controls. The supplied template repeats the urban-profile example question.
VIEW 09 / 11

Heritage · result layout

The score panel uses a warm translucent surface above the architectural backdrop.

Heritage portrait quiz result artboard.
Heritage interface variant. The result template displays a sample score of four out of five.
VIEW 10 / 11

Technology · physical controls

A metallic knob illustration explains rotation for selection and pressing for confirmation.

Geometric technology portrait quiz instructions artboard.
Geometric technology interface variant. The native instruction artboard explains the physical input and confirmation gesture.
VIEW 11 / 11

Technology · result layout

Electric green score type contrasts with the dark geometric background.

Geometric technology portrait quiz result artboard.
Geometric technology interface variant. The result template displays a sample score of four out of five.
04 / THE DETAILS

What brings
it together.

Structure, interaction and visual decisions that give the work its character.

Design decisions

  • Common quiz sequence
  • Separate answer and confirmation inputs
  • Portrait instruction screen

Project components

  • Documented production workflow
  • Visual composition study
Production notes & credits

RoleQuiz UI, shared engine, content configuration and physical-input integration; confirm the personally owned modules.

AssetsCredit WebView2, question content, fonts and source-provided resort, fish and turtle artwork separately. Illustration or geometry authorship, collaborator or AI contributions and rights to publish remain unverified. Five profile names do not prove five independent commissions.

StatusInterface and application-source study. The current flow specification was inspected directly; physical controls, complete runtime behavior and event delivery were not tested in this portfolio pass.

Image notes

  • The source-defined quiz standby screen, rendered from isolated HTML, CSS and the native fallback artwork. The fish and turtle instructions are source defaults; no quiz, scoring, physical input, native messaging or functional workflow was exercised.
  • Coastal interface variant. The question-and-answer layout retains its source example text and two answer controls.
  • Saved quiz result artboard showing the sample score 4/5 over the resort illustration.
  • Urban landscape interface variant. The question-and-answer layout retains its source example text and two answer controls.
  • Urban landscape interface variant. The result template displays a sample score of four out of five.
  • Theme-park interface variant. The question-and-answer layout retains its source example text and two answer controls. The supplied template repeats the urban-profile example question.
  • Theme-park interface variant. The result template displays a sample score of four out of five.
  • Heritage interface variant. The question-and-answer layout retains its source example text and two answer controls. The supplied template repeats the urban-profile example question.
  • Heritage interface variant. The result template displays a sample score of four out of five.
  • Geometric technology interface variant. The native instruction artboard explains the physical input and confirmation gesture.
  • Geometric technology interface variant. The result template displays a sample score of four out of five.
  • Resort background, fish and turtle illustrations are source-provided artwork. Original geometry, illustration authorship, collaborator/AI contributions and rights to publish are unverified. The isolated header identity is hidden only in this private derivative.
  • Native interface artwork. Isolated header identity removed in a copy; all other text, imagery and geometry retained. Supplied artwork and personal contribution require attribution. Static artboard, not a live participant session.
  • Native result-design artboard within the existing configurable-quiz project and its default Red Sea profile. This is saved artwork, not a measured participant score or an executed quiz transition. Resort imagery is supplied or upstream until its creator, licensing and possible AI contribution are established; personal interface contribution and public-use permission remain unverified.
HAVE SOMETHING IN MIND?Let’s make it
an experience.