SlideShare a Scribd company logo
1 of 34
Version 1.0
Building CLI for Geeks
By Dakshika Jayathilaka
dakshika@apache.org
dakshika@wso2.com
Overview
A command-line interface or command language interpreter (CLI), also known as
Command-line user interface,
Console user interface,
Character user interface (CUI),
is a means of interacting with a computer program where the user (or client) issues commands to the program in
the form of successive lines of text (command lines).(Wiki)
Real Geeks
hate GUIs
Efficient
Fast
Flexible
Pros
Rely on recall memory
Unknown conventions
Error-prone
Responsibility & Danger
Cons
Source: https://i.ytimg.com/vi/C4RsUtz8LGI/maxresdefault.jpg
CLIs
Define UX for CLI
1 Easy to learn 2 Efficient to use
Goals
Heuristics 1 Familiar Language
2 Structured Language
1 Easy to understand
2 Easy to Type
Challenges 1 Memorable 2 Typeable
UX
1 Memorable 2 Typeable
1. Model English
a. Use familiar punctuation
b. Use words, not symbols
c. Parallel Structure
d. Use the imperative mood
2. Model the Industry Standards
3. Use distinct words
4. Use shorter commands
5. Use meaningful words
6. Allow full command words
1 Familiar Language 2 Structured Language
1. Simple
2. Balance
3. Hierarchical
4. Define rules and follow
1 Easy to understand
1. Provide meaningful help &
guides
2. Use rich error messages/
warnings
3. Ask for confirmation
4. Give positive feedback
2 Easy to Type
1. Avoid key combinations
2. Be case sensitive
3. Use abbreviation with
truncation
To make Memorable
1 Familiar Language 2 Structured Language
Model English: Words & Punctuation1 Familiar Language
○ $ show files
○ $ delete files
○ $ ls
○ $ rm
Use Words
Avoid Symbols
○ $ delete files all ○ $ rm *
Use familiar punctuation
○ $ add wso2mb ○ $ add.wso2mb
Model English: Parallel Structure1 Familiar Language
○ $ enable dino
○ $ disable dino
○ $ dino enable
○ $ disable dino
semantically & grammatically parallel
○ $ add record
○ $ delete record
○ $ add record
○ $ kill record
Model English: Use the Imperative mood1 Familiar Language
○ Help !
○ Go !
○ Add Milk
○ Find the Book
Subject > Verb > Object
○ $ help
○ $ exit
○ $ show file
○ $ delete file
○ $ file show
○ $ file add
Model the Industry Standards1 Familiar Language
○ show dhcp
○ show dhcp server
CISCO IOS
○ kubectl get deployments hello-world
○ kubectl describe deployments hello-world
kubernetes
Use Distinct Words1 Familiar Language
● Avoid words looks similar - hard to read
● Avoid words sound similar - easy to confuse
● Words start the same are difficult to abbreviate
with truncation
● Words with similar typing pattern
○ $ send
○ $ find
○ $ choose
○ $ send
○ $ search
○ $ select
Use Shorter Commands1 Familiar Language
● Easy to remember
● Faster to type
● Short term memory is limited
○ $ add subnet
○ $ add pod
○ $ add ip assigned range
○ $ add pod privileged record
Use Meaningful Words1 Familiar Language
● Easy to remember
● Avoid Jargons unless it's a common term
○ $ add
○ $ user-name
○ $ delete
○ $ access-token-authenticator
○ $ concatenate
Allow Full command Words1 Familiar Language
● If the full word was not known, users will forgot
twice as many abbreviations
○ $ copy
○ $ move
○ $ delete
○ $ cp
○ $ mv
○ $ rm
Simple & Balanced2 Structured Language
● More focus on usage of the term
● 80/20
○ $ docker pull - Pull an image or a repository from a
registry
○ $ docker run - start the container
○ $ docker wait my_container - block until the container exits
Use Hierarchical structure2 Structured Language
● Tree like information structure
● Recall more accurately
● Each level helps to recall next
● Need fewer command words
A
B B
CCCC
Define rules and follow them2 Structured Language
● 1-3 command words per command
● 0-3 parameters per command
● Set default values for most parameters
● Unique word or first few characters
To make Typeable
1 Easy to understand 2 Easy to Type
Use rich error messages/ warnings1 Easy to understand
$ git stats
Did you mean this?
status
$ git bisect
usage: git bisect
[help|start|bad|good|new
|old|terms|skip|next|res
et|visualize|replay|log|
run]
○ $ git stats
Invalid Command
$ git bisect
Parameter invalid or
missing
Give feedback and Ask for Confirmation1 Easy to understand
$ add user dakshika
$ delete user dakshika
$ add user dakshika
dakshika has been
added to the system
$ delete user dakshika
Are you sure want to
delete “dakshika” [y/n] ?
Avoid key combinations & case sensitive2 Easy to Type
$ IPsec$ ipsec
● Shifted characters take longer to type & more
error prone
Use abbreviation with truncation2 Easy to Type
$ ethernt
$ ether
$ shw
$ dlt
$ ethernet eth
$ show s
$ delete del
● Helps to recall fast
● Allow to make their own
● Well-known acronyms instead words
Analyze Competitive analysis, task analysis, card sorting
Set Goals Target personas, User stories, Scope
design Organize, structure, proofread
Evaluate Testing, feedback loop
Process of building
Few more...
● Think about the security
● Test on different setups / OS /
environments
● Allow developers to customize
1. Command Language Design with Howard Kiewe 2013
2. Guidelines for Command Line Interface Design Mark Kampe
3. How we find the right words: designing for the command line
(https://puppet.com/blog/how-we-find-right-words-designing-command-line)
Resources
Thank you.

More Related Content

Similar to Building User experience for CLI(Command Line Interface)

Dynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool SupportDynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool Support
Lukas Renggli
 
Principles of-programming-languages-lecture-notes-
Principles of-programming-languages-lecture-notes-Principles of-programming-languages-lecture-notes-
Principles of-programming-languages-lecture-notes-
Krishna Sai
 
Shell tutorial
Shell tutorialShell tutorial
Shell tutorial
Vu Duy Tu
 
Domain Specific Languages
Domain Specific LanguagesDomain Specific Languages
Domain Specific Languages
elliando dias
 

Similar to Building User experience for CLI(Command Line Interface) (20)

Vitalii Braslavskyi "Declarative engineering"
Vitalii Braslavskyi "Declarative engineering"Vitalii Braslavskyi "Declarative engineering"
Vitalii Braslavskyi "Declarative engineering"
 
Architecting Domain-Specific Languages
Architecting Domain-Specific LanguagesArchitecting Domain-Specific Languages
Architecting Domain-Specific Languages
 
Introduction To Computer Programming
Introduction To Computer ProgrammingIntroduction To Computer Programming
Introduction To Computer Programming
 
Dynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool SupportDynamic Language Embedding With Homogeneous Tool Support
Dynamic Language Embedding With Homogeneous Tool Support
 
2018-Summer-Tutorial-Intro-to-Linux.pdf
2018-Summer-Tutorial-Intro-to-Linux.pdf2018-Summer-Tutorial-Intro-to-Linux.pdf
2018-Summer-Tutorial-Intro-to-Linux.pdf
 
Tools for the Toolmakers
Tools for the ToolmakersTools for the Toolmakers
Tools for the Toolmakers
 
Introduction to programming c
Introduction to programming cIntroduction to programming c
Introduction to programming c
 
Principles of Programming Languages - Lecture Notes
Principles of Programming Languages -  Lecture NotesPrinciples of Programming Languages -  Lecture Notes
Principles of Programming Languages - Lecture Notes
 
Principles of-programming-languages-lecture-notes-
Principles of-programming-languages-lecture-notes-Principles of-programming-languages-lecture-notes-
Principles of-programming-languages-lecture-notes-
 
Shell tutorial
Shell tutorialShell tutorial
Shell tutorial
 
Domain Specific Languages
Domain Specific LanguagesDomain Specific Languages
Domain Specific Languages
 
Tips and Tricks for Increased Development Efficiency
Tips and Tricks for Increased Development EfficiencyTips and Tricks for Increased Development Efficiency
Tips and Tricks for Increased Development Efficiency
 
C++ Demystified-A-Step-by-Step-Journey-into-High-Level-Programming.pptx
C++ Demystified-A-Step-by-Step-Journey-into-High-Level-Programming.pptxC++ Demystified-A-Step-by-Step-Journey-into-High-Level-Programming.pptx
C++ Demystified-A-Step-by-Step-Journey-into-High-Level-Programming.pptx
 
POS 433 Inspiring Innovation/tutorialrank.com
 POS 433 Inspiring Innovation/tutorialrank.com POS 433 Inspiring Innovation/tutorialrank.com
POS 433 Inspiring Innovation/tutorialrank.com
 
Tech talk 01.06.2017
Tech talk 01.06.2017Tech talk 01.06.2017
Tech talk 01.06.2017
 
C++ Restrictions for Game Programming.
C++ Restrictions for Game Programming.C++ Restrictions for Game Programming.
C++ Restrictions for Game Programming.
 
2022-Scripting_Hacks.pdf
2022-Scripting_Hacks.pdf2022-Scripting_Hacks.pdf
2022-Scripting_Hacks.pdf
 
C_Programming_Notes_ICE
C_Programming_Notes_ICEC_Programming_Notes_ICE
C_Programming_Notes_ICE
 
POS 433 Effective Communication - tutorialrank.com
POS 433 Effective Communication - tutorialrank.comPOS 433 Effective Communication - tutorialrank.com
POS 433 Effective Communication - tutorialrank.com
 
60761 linux
60761 linux60761 linux
60761 linux
 

Recently uploaded

Presentation on 3D Printing.pptx presentation
Presentation on 3D Printing.pptx presentationPresentation on 3D Printing.pptx presentation
Presentation on 3D Printing.pptx presentation
ajroy0196
 
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
ugzga
 
挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质
yzeoq
 
如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证
ugzga
 
100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...
100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...
100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...
pillahdonald
 
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
ugzga
 
如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证
ugzga
 
在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样
在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样
在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样
ykucop
 

Recently uploaded (20)

Presentation on 3D Printing.pptx presentation
Presentation on 3D Printing.pptx presentationPresentation on 3D Printing.pptx presentation
Presentation on 3D Printing.pptx presentation
 
Bit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolioBit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolio
 
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
 
Onyx Tiles Where Elegance Meets Durability
Onyx Tiles Where Elegance Meets DurabilityOnyx Tiles Where Elegance Meets Durability
Onyx Tiles Where Elegance Meets Durability
 
Webhost NVME Cloud VPS Hosting1234455678
Webhost NVME Cloud VPS Hosting1234455678Webhost NVME Cloud VPS Hosting1234455678
Webhost NVME Cloud VPS Hosting1234455678
 
Design Portofolios - Licensed Architect / BIM Specialist
Design Portofolios - Licensed Architect / BIM SpecialistDesign Portofolios - Licensed Architect / BIM Specialist
Design Portofolios - Licensed Architect / BIM Specialist
 
Naer VR: Advanced Research and Usability Testing Project
Naer VR: Advanced Research and Usability Testing ProjectNaer VR: Advanced Research and Usability Testing Project
Naer VR: Advanced Research and Usability Testing Project
 
Cascading Style Sheet(CSS) PDF Notes by Apna College
Cascading Style Sheet(CSS) PDF Notes by Apna CollegeCascading Style Sheet(CSS) PDF Notes by Apna College
Cascading Style Sheet(CSS) PDF Notes by Apna College
 
Avoid these common UI/UX design mistakes
 Avoid these common UI/UX design mistakes Avoid these common UI/UX design mistakes
Avoid these common UI/UX design mistakes
 
挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质挂科办理天主教大学毕业证成绩单一模一样品质
挂科办理天主教大学毕业证成绩单一模一样品质
 
iF_Design_Trend_Report_twentytwenrythree
iF_Design_Trend_Report_twentytwenrythreeiF_Design_Trend_Report_twentytwenrythree
iF_Design_Trend_Report_twentytwenrythree
 
如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Bath毕业证书)巴斯大学毕业证成绩单本科硕士学位证留信学历认证
 
Real Smart Art Infographics by Slidesgo.pptx
Real Smart Art Infographics by Slidesgo.pptxReal Smart Art Infographics by Slidesgo.pptx
Real Smart Art Infographics by Slidesgo.pptx
 
100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...
100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...
100^%)( KATLEHONG))(*((+27838792658))*))௹ )Abortion Pills for Sale in Doha, D...
 
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
 
Latest Trends in Home and Building Design
Latest Trends in Home and Building DesignLatest Trends in Home and Building Design
Latest Trends in Home and Building Design
 
如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UMN毕业证书)明尼苏达大学毕业证成绩单本科硕士学位证留信学历认证
 
Morgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity DesignMorgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity Design
 
CADD 141 - Puzzle Cube Project - Product Photos
CADD 141 - Puzzle Cube Project - Product PhotosCADD 141 - Puzzle Cube Project - Product Photos
CADD 141 - Puzzle Cube Project - Product Photos
 
在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样
在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样
在线购买田纳西大学毕业证(utk毕业证)硕士学历证书留信网认证原版一模一样
 

Building User experience for CLI(Command Line Interface)

  • 1. Version 1.0 Building CLI for Geeks By Dakshika Jayathilaka dakshika@apache.org dakshika@wso2.com
  • 2. Overview A command-line interface or command language interpreter (CLI), also known as Command-line user interface, Console user interface, Character user interface (CUI), is a means of interacting with a computer program where the user (or client) issues commands to the program in the form of successive lines of text (command lines).(Wiki)
  • 5.
  • 6. Rely on recall memory Unknown conventions Error-prone Responsibility & Danger Cons
  • 9. Define UX for CLI 1 Easy to learn 2 Efficient to use Goals Heuristics 1 Familiar Language 2 Structured Language 1 Easy to understand 2 Easy to Type Challenges 1 Memorable 2 Typeable
  • 10. UX 1 Memorable 2 Typeable
  • 11. 1. Model English a. Use familiar punctuation b. Use words, not symbols c. Parallel Structure d. Use the imperative mood 2. Model the Industry Standards 3. Use distinct words 4. Use shorter commands 5. Use meaningful words 6. Allow full command words 1 Familiar Language 2 Structured Language 1. Simple 2. Balance 3. Hierarchical 4. Define rules and follow
  • 12. 1 Easy to understand 1. Provide meaningful help & guides 2. Use rich error messages/ warnings 3. Ask for confirmation 4. Give positive feedback 2 Easy to Type 1. Avoid key combinations 2. Be case sensitive 3. Use abbreviation with truncation
  • 13. To make Memorable 1 Familiar Language 2 Structured Language
  • 14. Model English: Words & Punctuation1 Familiar Language ○ $ show files ○ $ delete files ○ $ ls ○ $ rm Use Words Avoid Symbols ○ $ delete files all ○ $ rm * Use familiar punctuation ○ $ add wso2mb ○ $ add.wso2mb
  • 15. Model English: Parallel Structure1 Familiar Language ○ $ enable dino ○ $ disable dino ○ $ dino enable ○ $ disable dino semantically & grammatically parallel ○ $ add record ○ $ delete record ○ $ add record ○ $ kill record
  • 16. Model English: Use the Imperative mood1 Familiar Language ○ Help ! ○ Go ! ○ Add Milk ○ Find the Book Subject > Verb > Object ○ $ help ○ $ exit ○ $ show file ○ $ delete file ○ $ file show ○ $ file add
  • 17. Model the Industry Standards1 Familiar Language ○ show dhcp ○ show dhcp server CISCO IOS ○ kubectl get deployments hello-world ○ kubectl describe deployments hello-world kubernetes
  • 18. Use Distinct Words1 Familiar Language ● Avoid words looks similar - hard to read ● Avoid words sound similar - easy to confuse ● Words start the same are difficult to abbreviate with truncation ● Words with similar typing pattern ○ $ send ○ $ find ○ $ choose ○ $ send ○ $ search ○ $ select
  • 19. Use Shorter Commands1 Familiar Language ● Easy to remember ● Faster to type ● Short term memory is limited ○ $ add subnet ○ $ add pod ○ $ add ip assigned range ○ $ add pod privileged record
  • 20. Use Meaningful Words1 Familiar Language ● Easy to remember ● Avoid Jargons unless it's a common term ○ $ add ○ $ user-name ○ $ delete ○ $ access-token-authenticator ○ $ concatenate
  • 21. Allow Full command Words1 Familiar Language ● If the full word was not known, users will forgot twice as many abbreviations ○ $ copy ○ $ move ○ $ delete ○ $ cp ○ $ mv ○ $ rm
  • 22. Simple & Balanced2 Structured Language ● More focus on usage of the term ● 80/20 ○ $ docker pull - Pull an image or a repository from a registry ○ $ docker run - start the container ○ $ docker wait my_container - block until the container exits
  • 23. Use Hierarchical structure2 Structured Language ● Tree like information structure ● Recall more accurately ● Each level helps to recall next ● Need fewer command words A B B CCCC
  • 24. Define rules and follow them2 Structured Language ● 1-3 command words per command ● 0-3 parameters per command ● Set default values for most parameters ● Unique word or first few characters
  • 25. To make Typeable 1 Easy to understand 2 Easy to Type
  • 26. Use rich error messages/ warnings1 Easy to understand $ git stats Did you mean this? status $ git bisect usage: git bisect [help|start|bad|good|new |old|terms|skip|next|res et|visualize|replay|log| run] ○ $ git stats Invalid Command $ git bisect Parameter invalid or missing
  • 27. Give feedback and Ask for Confirmation1 Easy to understand $ add user dakshika $ delete user dakshika $ add user dakshika dakshika has been added to the system $ delete user dakshika Are you sure want to delete “dakshika” [y/n] ?
  • 28. Avoid key combinations & case sensitive2 Easy to Type $ IPsec$ ipsec ● Shifted characters take longer to type & more error prone
  • 29. Use abbreviation with truncation2 Easy to Type $ ethernt $ ether $ shw $ dlt $ ethernet eth $ show s $ delete del ● Helps to recall fast ● Allow to make their own ● Well-known acronyms instead words
  • 30. Analyze Competitive analysis, task analysis, card sorting Set Goals Target personas, User stories, Scope design Organize, structure, proofread Evaluate Testing, feedback loop Process of building
  • 31. Few more... ● Think about the security ● Test on different setups / OS / environments ● Allow developers to customize
  • 32.
  • 33. 1. Command Language Design with Howard Kiewe 2013 2. Guidelines for Command Line Interface Design Mark Kampe 3. How we find the right words: designing for the command line (https://puppet.com/blog/how-we-find-right-words-designing-command-line) Resources