Skapa flödesscheman online: gratis editor
Med den här editorn skapar du flödesscheman enligt DIN 66001 av byggblock eller pseudokod. Symbolerna placeras automatiskt: Skriv till exempel ”WHILE x < 10” så får du en romb, loopens innehåll och en återkopplingslinje. Med ett knapptryck visas samma flöde som ett struktogram. Exportera som PNG, SVG eller PDF.
Byggd av Justin Schuessler
Gratis, utan registrering eller installation: Editorn körs helt i din webbläsare och dina diagram skickas inte till oss.
Är förloppet klart? Testa koden direkt på en egen VPS eller ett webbhotell.
Byggstenar
Tangentbord i diagrammet: ↑/↓ välj block, Enter redigera text, Alt+↑/↓ flytta, Delete radera, Insert infoga byggsten, Ctrl+Z/Ctrl+Y ångra/gör om, Ctrl+X/C/V klipp ut/kopiera/klistra in.
Syntax för pseudokod
PROGRAM Name INPUT x / OUTPUT x CALL procedure(x) IF condition THEN … ELSE IF … ELSE … END IF SWITCH x CASE 1: … DEFAULT: … END SWITCH WHILE condition … END WHILE REPEAT … UNTIL condition FOR i FROM 1 TO n STEP 1 … END FOR LOOP name … BREAK name … END LOOP
Varje annan rad är en instruktion. Med \ i början av raden är den alltid en instruktion, även om den börjar med ett nyckelord.
Indrag och skiftlägeskänslighet spelar ingen roll, och tyska och engelska nyckelord kan blandas. Ingen riktig programkod skapas eller körs.
Klicka på ett block i diagrammet för att redigera det här. Dubbelklicka för att redigera texten direkt i diagrammet.
Spara och exportera
Allt körs i din webbläsare: det aktuella arbetet sparas bara lokalt och delningslänken innehåller själva diagrammet. Inga data skickas till oss.
Funktioner
Flödesscheman utan att flytta runt rutor
Du beskriver förloppet, så placerar editorn ut symbolerna enligt DIN 66001, ritar linjerna och håller båda vyerna uppdaterade.
Symboler enligt DIN 66001
Start och slut, operation, förgrening, in- och utdata samt underprogram, sammanbundna med flödeslinjer och återgångar för loopar.
Växla till struktogram
Samma förlopp som ett struktogram enligt DIN 66261 (Nassi–Shneiderman), utan att du behöver rita om något.
Klickbaserad byggare
Placera byggstenar före, efter eller inuti ett block. Redigera texter direkt i diagrammet, flytta, ta bort och ångra.
Pseudokod åt båda hållen
Text och diagram hålls synkroniserade. Vid skrivfel visar editorn rad och felmeddelande, medan diagrammet står kvar.
Export och projektfil
PNG och SVG för dokument, PDF i A4-format för utskrift samt projektfil (JSON) för att spara och öppna igen.
Dela utan konto
Delningslänken innehåller diagrammet i adressen. Ingenting sparas på våra servrar.
Så fungerar det
Så skapar du ett flödesschema
Börja med en mall eller ett tomt flöde och arbeta på det sätt som passar dig.
Steg 1
Ladda en mall eller börja från början
Välj en av de nio exempelmallarna, som fakultet, skottår eller bubbelsortering, eller börja med ett tomt flöde via ”Ny”.
Steg 2
Bygg upp flödet med klick
Välj ett byggblock och placera det före eller efter ett annat, eller inuti ett block. Dubbelklicka för att redigera texten direkt i diagrammet.
Steg 3
Eller skriv pseudokod
Skriv flödet i pseudokodsfältet med tyska eller engelska nyckelord. Diagrammet ordnas automatiskt, och editorn visar skrivfel med radnummer.
Steg 4
Exportera eller dela
Ladda ned flödesschemat som PNG, SVG eller PDF (A4), spara projektfilen (JSON) eller kopiera en delningslänk.
DIN 66001
De viktigaste symbolerna i flödesschemat
Symbolerna från DIN 66001 som redigeraren använder för flödesscheman. Flödet placeras automatiskt, så du behöver inte flytta något.
Gränspunkt (start/slut)
Ovalen markerar flödesschemats början och slut.
Operation
En rektangel står för ett bearbetningssteg, t.ex. en tilldelning eller beräkning.
Indata/utdata
Parallellogrammen visar var data läses in eller matas ut.
Förgrening
Romben innehåller ett villkor. Beroende på resultatet fortsätter flödet via ja- eller nej-utgången.
Underprogram
En rektangel med dubbla sidolinjer anropar ett underprogram med ett eget flödesschema.
Flödeslinje
Linjer med pilspets förbinder symbolerna och visar ordningen. Normalt går flödet uppifrån och ned.
Förgrening med sammanfogning
Efter en förgrening möts båda vägarna igen vid en punkt innan flödet fortsätter.
Loopgräns (oändlig loop)
En sexhörning med avfasade övre hörn markerar loopens början, och en med avfasade nedre hörn markerar slutet. Redigeraren använder paret för den oändliga loopen.
Övergångspunkt (utgång)
En cirkel med en bokstav förbinder två ställen utan en lång linje. En utgång slutar i cirkel A, och flödet fortsätter vid cirkel A efter loopen.
Loop med återgång
En loop bildas av en förgrening och en återgångslinje till före villkoret.
Kontrollstrukturer
Loopar och förgreningar i flödesscheman
Så ritar editorn vanliga kontrollstrukturer och så skriver du dem i pseudokod med tyska eller engelska nyckelord.
Förgrening
Romben innehåller villkoret. Grenarna går åt vänster och höger och förenas sedan igen. Pseudokod: IF … THEN … ELSE … END IF.
Flervägsförgrening (switch case)
En romb med uttrycket och en gren för varje fall, eventuellt med en standardgren. Pseudokod: SWITCH x … CASE 1: … DEFAULT: … END SWITCH.
Förtestad loop
Romben står före loopens innehåll. Återkopplingslinjen går tillbaka till före villkoret på vänster sida, medan nej-grenen fortsätter åt höger. Pseudokod: WHILE … END WHILE.
Eftertestad loop
Loopens innehåll körs minst en gång, och romben med villkoret kommer efteråt. Pseudokod: REPEAT … UNTIL ….
Räkneloop
Ritas med tilldelning av startvärde, villkor, loopens innehåll och ökning av räknaren. Pseudokod: FOR i FROM 1 TO 10 … END FOR, eventuellt med STEP. Även tyska nyckelord stöds.
Oändlig loop med avbrott
Symbolparet för loopgränser omsluter loopens innehåll, och ett avbrott går via en kopplingspunkt till efter loopen. Pseudokod: LOOP … BREAK … END LOOP.
Exempel
Exempel på flödesscheman att öva med
Nio typiska övningsuppgifter från skola och utbildning finns som mallar. Välj en via ”Ladda exempelmall”, titta på det färdiga flödesschemat och pseudokoden och ändra dem.
- Fakultet
- Betygsberäkning
- Inloggning med 3 försök
- Skottår
- Största värdet i en lista
- Bubblesort
- Dryckesautomat
- Primtalstest
- Gissa talet
DIN 66261
De viktigaste symbolerna i struktogrammet
Nassi–Shneiderman-blocken som redigeraren kan rita. Varje block har exakt en ingång upptill och en utgång nedtill. Redigeraren stöder inte parallell bearbetning enligt DIN 66261.
Instruktion (strukturblock)
En rektangel för ett enskilt bearbetningssteg, t.ex. en tilldelning eller beräkning.
Följd (sekvens)
Block under varandra körs i följd uppifrån och ned. Indata och utdata är vanliga instruktionsblock.
Förgrening (val)
En triangel med villkoret delar flödet i en ja- och en nej-gren. En tom gren markeras med ∅.
Fallval (flervalsstruktur)
Beroende på värdet av ett uttryck körs exakt ett av fallen. Fallvärdena står direkt under diagonalen och det sista fallet (ofta ”annars” för alla övriga värden) i den högra triangeln.
Förtestad loop
Villkoret står överst och kontrolleras före varje varv. Om det är falskt redan från början körs loopens innehåll inte alls.
Eftertestad loop
Villkoret står nederst: loopens innehåll körs minst en gång och upprepas tills villkoret är uppfyllt.
Räkneloop
En förtestad loop med räknarvariabel, start- och slutvärde samt valfri steglängd.
Anrop av underprogram
Ett block med dubbla sidolinjer anropar ett separat underprogram som beskrivs på ett annat ställe.
Oändlig loop
En upprepning utan villkor: övre band (valfritt med beteckning), stapel till vänster och nedre band. Den kan bara lämnas via en utgång.
Utgång (avbrott)
Kilen till vänster lämnar den innersta omgivande loopen. Beteckningen anger vilket block som lämnas. Därefter fortsätter flödet med blocket efter loopen.
Upptäck mer
Fler verktyg
Regex-testare
Testa reguljära uttryck direkt mot den inbyggda JavaScript-motorn – med markering av träffar, capture-grupper och ersättningsläge, helt i webbläsaren.
Byggd av Jakub Martyniak
Struktogrameditor
NySkapa Nassi–Shneiderman-diagram enligt DIN 66261 online: med byggblock eller pseudokod, växla till flödesschema, använd 9 provmallar och exportera som PNG, SVG eller PDF.
Byggd av Justin Schuessler
Konvertera hexadecimalt till decimalt (binärt, hexadecimalt, decimalt, oktalt)
NyTalsystemsomvandlare: hexadecimalt till decimalt, binärt till decimalt och tvärtom, samt oktalt och valfri bas upp till 36. Med uträkning, tvåkomplement och klickbara bitar.
Byggd av Luca Stanek
FAQ
Vanliga frågor
Korta svar om flödesscheman, DIN 66001 och den här editorn.
Ett flödesschema visar ett programs eller en algoritms förlopp som en följd av standardiserade symboler sammanbundna med pilar. Det visar i vilken ordning instruktioner, inmatningar, utmatningar och beslut utförs, oberoende av programmeringsspråk. Det kallas även programflödesschema.
Ladda en exempelmall i editorn eller börja med ett tomt flöde via ”Ny”. Lägg till byggblock med klick eller skriv flödet som pseudokod – båda hålls synkroniserade. Editorn placerar symbolerna automatiskt: förgreningar delar sig åt vänster och höger och förenas sedan igen, medan looparnas återkopplingslinjer går till vänster om loopens innehåll. Exportera till sist som PNG, SVG eller PDF. Det är gratis och kräver ingen registrering.
Symbolerna definieras i DIN 66001 och internationellt i ISO 5807. Editorn använder en oval för start och slut, en rektangel för en operation, en romb för en förgrening, ett parallellogram för in- och utmatning, en rektangel med dubbla sidlinjer för ett underprogram, flödeslinjer med pilspetsar, en cirkel med en bokstav för en kopplingspunkt och symbolparet för loopgränser för en oändlig loop.
En loop skapas av en förgrening och en återkopplingslinje. I en villkorsstyrd loop står romben före loopens innehåll: Om villkoret är uppfyllt körs innehållet och linjen leder tillbaka till före romben. Annars fortsätter flödet åt höger. I en eftertestad loop står romben efter innehållet. En räkneloop ritas med tilldelning av startvärde, villkor, loopens innehåll och ökning av räknaren. En oändlig loop ritas med symbolparet för loopgränser, och ett avbrott går via en kopplingspunkt till efter loopen. En flervägsförgrening (switch case) blir en romb med en gren för varje fall och eventuellt en standardgren.
En rad per steg, med nyckelord för block: IF … THEN … ELSE … END IF, SWITCH x med CASE 1: och DEFAULT: fram till END SWITCH, WHILE … END WHILE, REPEAT … UNTIL …, FOR i FROM 1 TO 10 … END FOR, LOOP … END LOOP med BREAK samt INPUT, OUTPUT och CALL. Du kan även använda tyska nyckelord och växla mellan språken vid pseudokodsfältet. Editorn känner inte igen nyckelord på andra språk; sådana rader blir enkla instruktioner. Pseudokod som du har skrivit någon annanstans kan du klistra in direkt i fältet. Vid ett skrivfel visar editorn raden med en förklaring och behåller det senaste giltiga diagrammet.
Båda beskriver samma flöde. Flödesschemat kopplar samman symboler med pilar, och loopar visas med återkopplingslinjer. Struktogrammet (DIN 66261, Nassi–Shneiderman-diagram) nästlar block inuti varandra och saknar hopp. Det gör det mer kompakt och kräver en strukturerad lösning. I editorn kan du växla mellan vyerna eftersom båda ritas utifrån samma flöde.
Ja. Exportera det som en högupplöst PNG eller som SVG och infoga filen i Word, PowerPoint eller ett annat dokument. För utskrift finns en PDF på en A4-sida. Med projektfilen (JSON) kan du spara flödet och öppna det i editorn igen senare.
Editorn är gratis och kan användas utan registrering. Den körs helt i din webbläsare: det aktuella arbetet finns bara i webbläsarens lokala lagring och exporter skapas direkt på din enhet. I delningslänken ligger diagrammet i den del av adressen som kommer efter # och inte skickas till servern.
Fler frågor?
Kontakta supportenTesta koden till ditt flödesschema på en egen server
På en VPS från ZAP-Hosting har du full root-åtkomst för alla språk. På ett webbhotell kan du använda PHP och MySQL direkt.
Ingen konfigurering. Ingen risk. Online på några sekunder.
Letar du efter fler verktyg? Visa alla utvecklarverktyg
