Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Add an example drawing area to coding interviews

Aperta
  • Qualcosa non va?
#255 0 commenti 0 reazioni 1 assegnatario Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@Chuyutseng ci sta già lavorando.

Dal 8/10/2026.

  • #262 di @Chuyutseng — aperta

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
55/100
Tipo di issue
Funzionalità
Chiarezza
Abbastanza chiara
Stato di attività
Attiva
Stack tecnologico
rust
Ambito
full-stack

Direzione di ricerca

Start by locating the Whiteboard Interview Mode implementation and the interview page layout it diverges from — the proposal explicitly says to reuse the whiteboard's image-export/delivery mechanism for the interviewer view. Map where the editor, test runner and tabs/panels are composed in the interview workspace to decide where the Code | Example tab or expandable panel attaches. Done looks like: a canvas with pen, eraser, rectangle, circle, line, arrow, undo/redo and clear, living alongside the existing editor and test flow, with the current drawing delivered to the interviewer on content change. No file, test or entry point is named in the issue, so scope and layout decisions remain with the maintainer.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Motivation

During a normal coding interview, candidates often need to explain an example input, output, or data structure before or while writing code.

For problems involving trees, linked lists, graphs, arrays, pointer movement, or intermediate algorithm states, a visual explanation can be clearer than describing everything verbally or drawing ASCII diagrams inside code comments.

CodeTrial already provides a separate Whiteboard Interview Mode, but that mode replaces the editor and test workflow. This proposal is different: it keeps the existing coding interview experience and adds a drawing area that can be used together with the editor and test runner.

The goal is to provide a dedicated space for visually explaining examples and data structures without interrupting the normal coding workflow.

Proposal

Add an example drawing area to the existing coding interview workspace.

The drawing area would be available during a normal coding interview and would not replace the editor, test results, or current interview flow.

Candidates could use it to illustrate:

  • Example inputs and outputs
  • Binary trees and other tree structures
  • Linked lists
  • Graphs
  • Arrays
  • Pointer movement
  • Intermediate states while explaining an algorithm

Drawing tools

The first version could provide the following tools:

  • Pen
  • Eraser
  • Rectangle
  • Circle / ellipse
  • Line
  • Arrow
  • Undo / redo
  • Clear

The pen would still be useful for handwritten values or short labels. For example, a candidate could draw circles for tree nodes, connect them with lines or arrows, and write node values inside the circles.

Interaction with the existing interview

The drawing area should work as an additional part of the normal coding interview rather than as a separate interview mode.

A candidate could, for example:

  1. Read and repeat the problem.
  2. Draw a sample input or data structure in the example area.
  3. Explain the approach while referring to the drawing.
  4. Write the implementation in the existing editor.
  5. Run tests as usual.
  6. Update the drawing when explaining edge cases, pointer movement, or optimization.

How the interviewer sees the drawing

The drawing should also be visible to the interviewer so that it can become part of the interview conversation.

When a candidate refers to a tree node, graph edge, pointer, array position, or intermediate state, the interviewer should be able to inspect the current drawing and understand what the candidate is referring to.

This could potentially reuse the existing image-delivery mechanism from Whiteboard Interview Mode by exporting the current drawing and sending it to the interviewer when the content changes.

The goal is not only to give the candidate a place to sketch, but also to let the interviewer use the drawing as part of the interview context.

Possible layout

The drawing area could be presented as a tab or an expandable panel in the existing interview page so that it does not permanently reduce the space available to the editor.

For example:

  • Code | Example
  • or an expandable Example panel below the page

The exact layout can follow the current interview page design.

Scope

The initial version is intended to support visual explanation during coding interviews rather than provide a full diagram editor.

It does not need to support:

  • Selecting existing objects
  • Moving shapes
  • Resizing shapes
  • Editing text objects
  • Grouping objects
  • Layers
  • Advanced diagram editing features

The main goal is to make common coding interview examples easier to draw, explain, and discuss with the interviewer.

Lingua principale
Rust
Stelle
144
Fork
41
Merge medio
1g 9h
PR unite (30g)
95

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di sysprog21/codetrial

Tutte le issue di sysprog21/codetrial

Issue simili

Altre issue su Rust

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.