Back Original

Monosketch

    
          ╭──────────────╮
          │ Have a good  │
          │    day!!!    │
        ╭─┼──────────────╯
 /\_/\  ╰─╯               
( o.o )                   
 > ^ <

I'm passionate about creating ASCII graphs, versatile visual aids for demonstrations and code integration.

After an unsuccessful search for a good solution, I was inspired to embark on this project.

with building blocks

    
  Rectangle            Line             Text box   
┌────────────┐                       ┌────────────┐
│            │    ───────────────    │            │
│            │                       │    Text    │
│            │                       │            │
└────────────┘                       └────────────┘

...and apply formats

    
  Rectangle            Line             Text box   
╭────────────╮                       ╔ ═ ═ ═ ═ ═ ═ 
│            │    ■━━━━━━━━━━━━━▶     ████████████║
│            │                       ║Text████████ 
│            │                        ████████████║
╰────────────╯                       ╚ ═ ═ ═ ═ ═ ═ 

the result

    
┌ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ 
 Network Interface                             │
│┌───────────────────┐    ┌───────────────────┐ 
 │      Cluster      │    │      Client       ││
││   Communication   │    │   Communication   │ 
 └───────────────────┘    └──────□────────────┘│
└ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─│─ ─ ─ ─ ─ ─ ─ 
                  ┌──────────────┘              
┌ ─ ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ 
 Relational Engine│                            │
│┌────────────────▼──┐    ┌───────────────────┐ 
 │  Command Parser   □────▶  Query Optimizer  ││
││                   │    │                   │ 
 └───────────────────┘    └─────────□─────────┘│
│┌───────────────────┐              │           
 │  Query Executor   ◀──────────────┘          │
││                   │                          
 └───────────────────┘                         │
└ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ 

See examples

    
            Client                             Server                 
               ■                                    ■                 
               │      Establish TCP Connection      │                 
┌ ─ ─ ─ ─ ─ ─ ─│─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ 
            SYN├───────────────────────────────────▶░SYN             │
│              │                                    ░ACK              
            ACK│◀───────────────────────────────────░                │
└ ─ ─ ─ ─ ─ ─ ─│─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ 
               │                                    │                 
               │                                    │                 
               │         SSL/TLS Handshake          │                 
┌ ─ ─ ─ ─ ─ ─ ─│─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ 
    ClientHello░───────────────────────────────────▶░                │
│              ░                                    ░Server Hello     
    Certificate░◀───────────────────────────────────░Certificate     │
│  verification░                                    ░                 
               ░                                    ░                │
│     ClientKey░◀──────────────────────────────────▶░ServerFinished   
       Exchange│                                    │                │
└ ─ ─ ─ ─ ─ ─ ─│─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ 
               │                                    │                 
               │     Encrypted Application Data     │                 
┌ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ 
          HTTP │◀──────────────────────────────────▶│HTTP            │
│          GET │                                    │Response         
 ─ ─ ─ ─ ─ ─ ─ ┼ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┘
               │                                    │                 
               ■                                    ■                 
    
             ┌ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─     
              Edge Region 1                                           │    
             │                                                             
                   ┌──────────────┐   send msg to ╭──────────────╮    │    
 /\_/\       │     │┌─────────────┴┐   websocket  │╭─────────────┴╮    
( o.o ) ◀══════════└┤┌─────────────┴┐◀═══════════▶╰┤╭─────────────┴╮  │    
 > ^ <       │      └┤    Envoy     │ sub to this  ╰┤Gateway server│       
                     └──────▲───────┘   channel     ╰───────▲──────╯  │    
             └ ─ ─ ─ ─ ─ ─ ─║─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─│─ ─ ─ ─ ─     
                            ║                               │              
 /\_/\                      ║                               │       
( o.o ) ◀═══════════════════╝                               │              
 > ^ <                                                      └──────────┐   
   │    ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─│─ ┐
   │   │Main region                                            send msg│   
   │                                                             to all│  │
   │   │   ┌──────────────┐               ╭──────────────╮      GS subs│   
   │       │┌─────────────┴┐     send     │╭─────────────┴╮            │  │
   └───┼───┴┤┌─────────────┴┐ channel msg ╰┤╭─────────────┴╮           │   
            └┤    Webapp    ├──────────────┴▶ Admin Server ├─┐         │  │
       │     └───────┬──────┘               ╰──────────────╯ │         │   
                     │ store                        route to │         │  │
       │             ▼ message                       channel │         │   
                 ░░░░░░░░                             server │         │  │
       │         ░Vitess░                           ╭────────▼─────╮   │   
                 ░░░░░░░░                           │╭─────────────┴╮  │  │
       │                                            ╰┤╭─────────────┴╮ │   
                                                     ╰┤Channel Server├─┘  │
       │                                              ╰──────────────╯     
        ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ┘
    
    
                         /\_/\        
                        ( o.o )                            
                         > ^ <                             
                                                           
┌──────────────────────────────────────────────────┬──────┐
│                                                  │░░░░░░│
│ Type something to search                         │░░GO░░│
│                                                  │░░░░░░│
└──────────────────────────────────────────────────┴──────┘
                                                           
       ┌─────────────────────┐ ┌─────────────────────┐     
       │     Cat search      │ │    I feel lucky     │     
       └─────────────────────┘ └─────────────────────┘     
    
                           app.monosketch.io      
┌────────────────────────────────────────────────────────────────┐
│MonoSketch                   █ ▒ ▒ ▒                         ...│
├───────────────────────────────────────────────────┬────────────┤
│                                                   │            │
│                                                   │            │
│                                                   │            │
│                                                   │            │
│                                                   │Shape format│
│                     Workspace                     │   panel    │
│                                                   │            │
│                                                   │            │
│                                                   │            │
│                                                   │            │
│                                                   │            │
└───────────────────────────────────────────────────┴────────────┘
    
╭────────────────────────────────────────────────────────────────╮
│                      https://example.com                       │
├────────────────────────────────────────────────────────────────┤
│                                                                │
│                             Welcome!                           │
│         ╭──────────────────────────────────────────────╮       │
│         │ username                                     │       │
│         ╰──────────────────────────────────────────────╯       │
│         ╭──────────────────────────────────────────────╮       │
│         │ *******                                      │       │
│         ╰──────────────────────────────────────────────╯       │
│                                       ╭────────────────╮       │
│                                       │    Sign-up     │       │
│                                       ╰────────────────╯       │
╰────────────────────────────────────────────────────────────────╯

Thanks to MonoSketch, I no longer rely on Power Point or Google Presentations to craft my presentations.

MonoSketch is an open-source project licensed under the Apache License 2.0.

If you find this project useful, please consider starring the repository on GitHub. Contributions are also welcome through pull requests or by opening issues on GitHub.

Support

If you would like to support the project financially, you can do so by becoming a GitHub Sponsor or contributing via Kofi.

    
                                                    ╭────────────╮
                                                    │ Enjoy mono │
                                                    │ sketching  │
                                                  ╭─┼────────────╯
                      /^--^\     /^--^\     /^--^\╰─╯
                      \____/     \____/     \____/
                     /      \   /      \   /      \
                    |        | |        | |        | 
                     \__  __/   \__  __/   \__  __/
|^|^|^|^|^|^|^|^|^|^|^|^\ \^|^|^|^/ /^|^|^|^|^\ \^|^|^|^|^|^|^|^|^|^|^|^|
| | | | | | | | | | | | |\ \| | |/ /| | | | | |\ \| | | | | | | | | | | |
#########################/ /#####\ \###########/ /#######################
| | | | | | | | | | | | |\/ | | | \/| | | | | |\/ | | | | | | | | | | | |
|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|_|