Dette prosjektet viser en praktisk bro mellom Visuinos visuelle oversikt og kodearbeid i Codex. Komponenter og koblinger blir fortsatt synlige i Visuino, mens egen Arduino-kode kan utvikles og forbedres i en ekstern C++-header.
Poenget er å sette opp koblingen én gang. Så lenge include-stien, namespace og funksjonsgrensesnittet holdes stabile, kan implementasjonen endres i Codex eller VS Code og kompileres fra Visuino uten gjentatt kopiering, liming eller parsing.
Hvorfor kombinere Visuino og Codex?
Visuino gjør det lett å se sensorer, komponenter og forbindelser, særlig når en prototype vokser. Codex er nyttig når den egendefinerte koden skal skrives, forklares eller endres. Den eksterne headerfilen lar de to arbeidsformene møtes uten at den visuelle modellen må gi fra seg oversikten.
Visuino-prosjektet beholder de visuelle blokkene og bestemmer når funksjonene kalles. Headerfilen eier selve implementasjonen. Dermed kan du arbeide mer fritt med koden, samtidig som koblingen til Visuino er tydelig og repeterbar.
Pakk ut ZIP-filen permanent
Legg innholdet i en mappe som ikke flyttes etter at prosjektet er konfigurert. Den fullstendige stien brukes av importskissen.
Pek til din TestProgram.h
Oppdater importskissen med den komplette lokale stien til headerfilen. Stien må stemme på maskinen som kompilerer.
Parse den vanlige Arduino-skissen
Bruk Visuinos Parse Arduino Code med den medfølgende, ordinære .ino-skissen.
Fordel koden i Visuino
I den demonstrerte Visuino-versjonen legges koblingen i Includes, On Init og On Execute.
Åpne samme header i Codex
Endre og lagre implementasjonen i Codex eller VS Code med Copilot, og kompiler deretter prosjektet i Visuino.
Hva nedlastingen inneholder
Den offisielle prosjektpakken inneholder både et minimalt eksempel og dokumentasjonen som trengs for å gjenskape arbeidsflyten.
Et lite Serial-eksempel
Et avgrenset eksempel gjør det lettere å se når funksjonene initieres og kjøres.
Den opprinnelige .ino-skissen
Den vanlige Arduino-skissen brukes som et tydelig importgrunnlag for Visuinos kodeparser.
Den eksterne headerfilen
TestProgram.h er filen som åpnes i Codex og endres videre uten at arbeidsflyten bygges på nytt.
En egen importskisse
Importskissen samler include-sti og funksjonskallene Visuino trenger for den første konfigurasjonen.
Trinn og Codex-prompter
Veiledningen forklarer full headersti, namespace og prompter som kan brukes når koden skal forstås eller videreutvikles.
Se den riktige demonstrasjonen
Videoen viser førstegangsoppsettet og deretter to kodeendringer som blir kompilert fra Visuino. Den erstatter «Coming Soon»-videoen som tidligere lå i blogginnlegget.
Kontrakten som gjør raske endringer mulig
Headerstien
Visuino må fortsatt kunne finne den samme headerfilen. Flyttes mappen, må den fullstendige stien oppdateres.
Namespace
Namespace holder egne funksjoner adskilt fra annen kode og reduserer risikoen for navnekollisjoner.
Funksjonsnavn og signaturer
Visuinos kall må fortsatt passe funksjonene i headeren. Endres grensesnittet, må begge sider oppdateres.
Koden bak grensesnittet
Selve implementasjonen kan videreutvikles mange ganger uten ny parsing når kontrakten rundt den består.
Hva som faktisk ble verifisert
- Den eksterne headeren kan inkluderes gjennom den beskrevne Visuino-flyten.
- Det første oppsettet og to senere kodeendringer vises i videoen.
- Endringene ble kompilert fra Visuino for Arduino Uno.
- Implementasjonsendringer krever ikke gjentatt kopiering eller parsing når include-sti, namespace og funksjonsgrensesnitt er uendret.
- Opplasting og fysisk enhetsadferd må testes på brukerens eget kort.
Når denne metoden passer
Sensorprototyper
Behold en tydelig visuell flyt mens filtrering, beregning eller leverandørspesifikk logikk utvikles i C++.
Serial og protokoller
Legg parsing og hjelpefunksjoner i headeren uten å gjøre Visuino-diagrammet vanskelig å lese.
Egne algoritmer
Bruk Codex til å forklare og forbedre avgrenset logikk, mens Visuino fortsatt styrer initiering og kjøring.
Kontrollert læring
Sammenlign den visuelle modellen med den faktiske koden og test én endring om gangen.
Dokumentert på Visuino Wiki
Visuino Wiki har en egen seksjon med navnet Finn André Hotvedt. Den samler 14 Visuino-veiledninger fra YouTube-kanalen, inkludert den første norske demonstrasjonen og guider om blant annet Delphi, MQTT, Modbus, Wokwi og tredjepartskomponenter.
Kilde og videre arbeid
Visuino Hub-siden er primærkilden for pakken, videoen og de dokumenterte grensene. Les instruksjonene i nedlastingen før du endrer stier eller funksjonsgrensesnitt, og behold en fungerende kopi før større kodeendringer.
This project demonstrates a practical bridge between Visuino’s visual overview and code work in Codex. Components and connections remain visible in Visuino, while custom Arduino code can be developed and refined in an external C++ header.
The connection is configured once. As long as the include path, namespace, and function interface remain stable, the implementation can be changed in Codex or VS Code and compiled from Visuino without repeated copying, pasting, or parsing.
Why combine Visuino and Codex?
Visuino makes sensors, components, and connections easy to see, especially as a prototype grows. Codex is useful when custom code must be written, explained, or modified. The external header lets those two workflows meet without sacrificing the visual model.
The Visuino project retains the visual blocks and decides when functions are called. The header owns the implementation. You can therefore work more freely with the code while keeping the connection to Visuino explicit and repeatable.
Extract the ZIP permanently
Place the files in a folder that will not move after configuration. The import sketch uses the full path.
Point to your TestProgram.h
Update the import sketch with the complete local path to the header on the machine that compiles the project.
Parse the regular Arduino sketch
Use Visuino’s Parse Arduino Code feature with the supplied standard .ino sketch.
Place the code in Visuino
In the demonstrated Visuino version, the connection is placed in Includes, On Init, and On Execute.
Open the same header in Codex
Modify and save the implementation in Codex or VS Code with Copilot, then compile the project in Visuino.
What the download contains
The official project package includes both a minimal example and the documentation needed to reproduce the workflow.
A small Serial example
A bounded example makes it easier to see when functions are initialized and executed.
The original .ino sketch
The regular Arduino sketch provides a clear import source for Visuino’s code parser.
The external header
TestProgram.h is opened in Codex and can be refined without rebuilding the workflow.
A dedicated import sketch
The import sketch gathers the include path and function calls needed for the initial Visuino setup.
Steps and Codex prompts
The guide explains the full header path, namespaces, and prompts for understanding or extending the code.
Watch the correct demonstration
The video shows the initial setup and two subsequent code changes compiled from Visuino. It replaces the unrelated “Coming Soon” video previously shown in the article.
The contract that enables fast changes
The header path
Visuino must continue to find the same header. If the folder moves, update the complete path.
The namespace
A namespace keeps custom functions separate from other code and reduces naming collisions.
Function names and signatures
Visuino’s calls must continue to match the functions in the header. If the interface changes, update both sides.
The code behind the interface
The implementation can change repeatedly without reparsing while the surrounding contract stays intact.
What was actually verified
- The external header can be included through the documented Visuino workflow.
- The initial setup and two later code changes are shown in the video.
- The changes were compiled from Visuino for Arduino Uno.
- Implementation changes do not require repeated copying or parsing while the include path, namespace, and function interface remain unchanged.
- Uploading and physical device behaviour must be tested on the user’s own board.
Where this method fits
Sensor prototypes
Keep a clear visual flow while filtering, calculations, or vendor-specific logic are developed in C++.
Serial and protocols
Keep parsing and helper functions in the header without making the Visuino diagram difficult to read.
Custom algorithms
Use Codex to explain and improve bounded logic while Visuino continues to control initialization and execution.
Controlled learning
Compare the visual model with the actual code and test one change at a time.
Documented on the Visuino Wiki
The Visuino Wiki has a dedicated section named Finn André Hotvedt. It collects 14 Visuino tutorials from the YouTube channel, including the first Norwegian demonstration and guides covering Delphi, MQTT, Modbus, Wokwi, and third-party components.
Source and next steps
The Visuino Hub page is the primary source for the package, video, and documented boundaries. Read the included instructions before changing paths or function interfaces, and keep a working copy before larger code changes.