[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"detail-sidebar-cat-0-en-105":3,"doc-seo-656286-105":59,"doc-detail-656286-en":130},{"code":4,"msg":5,"data":6},0,"success",[7,13,18,23,28,33,38,43,48,51,55],{"id":8,"doc_module":4,"doc_module_name":9,"category_name":10,"show_sort_weight":11,"slug":12},1,"Document","Story & Novel",90,"story-novel",{"id":14,"doc_module":4,"doc_module_name":9,"category_name":15,"show_sort_weight":16,"slug":17},2,"Literature",80,"literature",{"id":19,"doc_module":4,"doc_module_name":9,"category_name":20,"show_sort_weight":21,"slug":22},4,"Exam",70,"exam",{"id":24,"doc_module":4,"doc_module_name":9,"category_name":25,"show_sort_weight":26,"slug":27},5,"Comic",60,"comic",{"id":29,"doc_module":4,"doc_module_name":9,"category_name":30,"show_sort_weight":31,"slug":32},6,"Technology",50,"technology",{"id":34,"doc_module":4,"doc_module_name":9,"category_name":35,"show_sort_weight":36,"slug":37},7,"Healthcare",40,"healthcare",{"id":39,"doc_module":4,"doc_module_name":9,"category_name":40,"show_sort_weight":41,"slug":42},8,"Research & Report",30,"research-report",{"id":44,"doc_module":4,"doc_module_name":9,"category_name":45,"show_sort_weight":46,"slug":47},9,"Religion & Spirituality",20,"religion-spirituality",{"id":46,"doc_module":4,"doc_module_name":9,"category_name":49,"show_sort_weight":46,"slug":50},"World Cup","world-cup",{"id":52,"doc_module":4,"doc_module_name":9,"category_name":53,"show_sort_weight":52,"slug":54},10,"Lifestyle","lifestyle",{"id":56,"doc_module":4,"doc_module_name":9,"category_name":57,"show_sort_weight":24,"slug":58},19,"General","general",{"code":4,"msg":60,"data":61},"ok",{"site_id":62,"language":63,"slug":64,"title":65,"keywords":66,"description":67,"schema_data":68,"social_meta":123,"head_meta":125,"extra_data":127,"updated_unix":129},105,"en","skyline-mental-model-diagram-generator-group-1-28-jan-2025","Skyline - Mental Model Diagram Generator - Group 1 - 28 Jan 2025","","Skyline is a Mental Model Diagram Generator presented as a project about structuring how systems work in people’s minds and translating these ideas into usable diagramming outputs. The material explains mental model diagrams using a 3-level hierarchy (box, tower, block), connects them to alignment diagrams, and reviews limitations of Indi Young’s original generator. The project proposes Skyline with improved reliability, enhanced design and usability, multi-language support, live spreadsheet editing and downloads, and a desktop application, including its implementation approach and technology stack.",{"@graph":69,"@context":122},[70,84,105],{"@type":71,"itemListElement":72},"BreadcrumbList",[73,77,79,82],{"item":74,"name":75,"@type":76,"position":8},"https://docshare.wps.com","Home","ListItem",{"item":78,"name":9,"@type":76,"position":14},"https://docshare.wps.com/document/",{"item":80,"name":30,"@type":76,"position":81},"https://docshare.wps.com/document/technology/",3,{"item":83,"name":65,"@type":76,"position":19},"https://docshare.wps.com/document/skyline-mental-model-diagram-generator-group-1-28-jan-2025/656286/",{"url":83,"name":65,"@type":85,"image":86,"author":91,"headline":65,"publisher":94,"fileFormat":97,"inLanguage":63,"description":67,"dateModified":98,"datePublished":99,"encodingFormat":97,"isAccessibleForFree":100,"interactionStatistic":101},"DigitalDocument",{"url":87,"@type":88,"width":89,"height":90},"https://docshare.wps.com/thumbnails/skyline-mental-model-diagram-generator-group-1-28-jan-2025/656286.png","ImageObject",300,407,{"name":92,"@type":93},"Helloiii","Person",{"url":74,"name":95,"@type":96},"DocShare","Organization","application/pdf","2026-10-29","2026-10-25",true,{"@type":102,"interactionType":103,"userInteractionCount":19},"InteractionCounter",{"@type":104},"ViewAction",{"@type":106,"mainEntity":107},"FAQPage",[108,114,118],{"name":109,"@type":110,"acceptedAnswer":111},"What is the purpose of Skyline in relation to mental models?","Question",{"text":112,"@type":113},"Skyline generates mental model diagrams by translating ideas about how systems work in someone’s mind into diagram structures that can be used and understood more easily.","Answer",{"name":115,"@type":110,"acceptedAnswer":116},"How are mental model diagrams structured in the presentation?",{"text":117,"@type":113},"They use a 3-level hierarchy: boxes summarize inner thinking or guiding principles, towers group multiple boxes for the same purpose, and blocks collect towers for a high-level goal.",{"name":119,"@type":110,"acceptedAnswer":120},"What problems with Indi Young’s Mental Model Generator does Skyline address?",{"text":121,"@type":113},"The presentation lists issues such as counterintuitive usage, weak GUI design, faulty sheet re-upload, invalid SVGs, limited personalization options, no real-time editing, and incomplete functionality. Skyline replaces this with improved reliability, design, usability, and additional editing and download capabilities.","https://schema.org",{"og:url":83,"og:type":124,"og:title":65,"og:site_name":95,"og:description":67},"article",{"robots":126,"canonical":83},"index,follow",{"doc_id":128,"site_id":62},656286,1793051454,{"code":4,"msg":5,"data":131},{"doc_id":128,"user_id":132,"nickname":92,"user_avatar":133,"doc_module":4,"category_id":29,"category_name":30,"doc_title":65,"doc_description":67,"doc_content":134,"file_id":135,"file_url":136,"file_type":137,"file_size":138,"view_count":19,"is_deleted":4,"is_public":8,"is_downloadable":8,"audit_status":8,"page_count":139,"language":140,"language_code":63,"site_id":62,"html_lang":63,"table_of_contents":141,"faqs":142,"seo_title":143,"seo_description":67,"update_tm":144,"read_time":145},5909897196768,"https://ap-avatar.wpscdn.com/davatar_29158cc5080c5b710cf443261637dec0","Skyline  \nMental Model Diagram Generator  \nKatharina Aschauer, Jules Albert Gaston Barreaux, Alberto Mimbrero Sánchez, Águeda Pradera Medina  \nInformation Architecture and Web Usability  \nGroup 1  \n28 Jan 2025  \nCopyright 2025 by the author(s), except as otherwise noted.  \nThis work is placed under a Creative Commons Attribution 4.0 International (CC BY 4.0) licence  \nMental Model Diagrams  \n● Mental Model Diagrams represent how a system works in someone’s mind.[1]  \n● 3 Level Hierarchy (by Indi Young [2]):  \n○ Box: summary of inner thinking, emotional reaction or guiding principle.  \n○ Tower: collection of multiple boxes related to the same purpose.  \n○ Block: collection of towers with the same high-level goal.  \nMental Model Diagram snippet to demonstrate the different building blocks.  \n[1] Jack O’Donoghue, 10 Mental Model Examples for Better UX Design, 20 Feb 2023: [https://makeiterate.com/mental-model-examples-for-better-ux-design/](https://makeiterate.com/mental-model-examples-for-better-ux-design/)  \n[2] Indi Young, Mental Models: Aligning Design Strategy with Human Behavior. Rosenfeld Media 2008, ISBN 9781933820194, Chapter 10. 1 / 16  \nMental Model Diagrams and Alignment Diagrams  \n● Alignment Diagrams “describe the class of maps and diagrams that visualize touchpoints in a business process”. [1]  \n● Mental Model Diagrams can be used as top half of an Alignment Diagram .  \n● Mental Model Alignment Diagrams give overview about many aspects of a product.  \n○ Redundancies, opportunities, misconceptions.  \n○ Easily readable, can be understood by people without background knowledge.  \nAlignment Diagram consisting of a Mental Model Diagram and a Content Model.  \n[1] James Kalbach, Paul Kahn, Locating Value with Alignment Diagrams, Parsons Journal for Information Mapping, Spring 2011  \n[h](http://piim.newschool.edu/journal/issues/2011/02/pdfs/ParsonsJournalForInformationMapping_Kalbach-James)[ttp://piim.newschool.edu/journal/issues/2011/02/pdfs/ParsonsJournalForInformationMapping_Kalbach-James](http://piim.newschool.edu/journal/issues/2011/02/pdfs/ParsonsJournalForInformationMapping_Kalbach-James)+Kahn-Paul.pdf, Page 2-3  \n2 / 16  \nShowcase: Indi Young’s Generator  \nUrl to video  \n[https://youtu.be/Rw2bIwt7Fok](https://youtu.be/Rw2bIwt7Fok)  \nIndi Young’s Mental Model Generator [1]  \n● Usage is counterintuitive .  \n● GUI is not very well designed.  \n[1] [https://indiyoung.com/mmd_generator.html](https://indiyoung.com/mmd_generator.html 4 / 16)[ 4 / 16](https://indiyoung.com/mmd_generator.html 4 / 16)  \nIndi Young’s Mental Model Generator [1]  \nOther problems:  \n● Sheet re-upload is faulty.  \n● Invalid SVGs.  \n● Limited options for personalization.  \n● No possibility to edit in real time.  \n● Unfinished, does not provide all the  \nSolution:  \n● Skyline: Mental Model Diagram Generator  \n[1] [https://indiyoung.com/mmd_generator.html](https://indiyoung.com/mmd_generator.html 5 / 16)[ 5 / 16](https://indiyoung.com/mmd_generator.html 5 / 16)  \nSkyline-Mental Model Diagram Generator  \nSkyline-Mental Model Diagram Generator  \n● Inspiration: Indi Young’s Mental Model Diagram Generator.  \n● Motivation: rewrite, so more usable and more features.  \n● Added Features:  \n○ Better, more reliable functionality.  \n○ Improved design and usability.  \n○ Multi-language: English, French, German, Spanish.  \n○ Live spreadsheet editing and download.  \n○ Desktop application.  \n● GitHub Repository: [https://github.com/katasc22/iaweb24-mmd-generator](https://github.com/katasc22/iaweb24-mmd-generator)  \n● Deployed via GitHub pages on:  \n[https://katasc22.github.io/iaweb24-mmd-generator/](https://katasc22.github.io/iaweb24-mmd-generator/)  \nTech Stack  \n● Frontend: Nuxt (vue.js) .  \n● Spreadsheet parsing: SheetJS (supports xlsx, ods and csv: [https://sheetjs.com/](https://sheetjs.com/) ).  \n● Spreadsheet preview: Canvas DataGrid ([https://canvas-datagrid.js.org/](https://canvas-datagrid.js.org/) ).  \n● Tailwind CSS for styling ([https://tailwindcss.com/](","cbCait7UqmMh5S0Z","https://ap.wps.com/l/cbCait7UqmMh5S0Z","pdf",1229853,17,"English","# Mental Model Diagrams\n## 3 Level Hierarchy\n# Mental Model Diagrams and Alignment Diagrams\n## Alignment Diagram Concepts\n# Showcase: Indi Young’s Generator\n# Skyline: Mental Model Diagram Generator\n## Added Features\n# Tech Stack","[{\"question\":\"What is the purpose of Skyline in relation to mental models?\",\"answer\":\"Skyline generates mental model diagrams by translating ideas about how systems work in someone’s mind into diagram structures that can be used and understood more easily.\"},{\"question\":\"How are mental model diagrams structured in the presentation?\",\"answer\":\"They use a 3-level hierarchy: boxes summarize inner thinking or guiding principles, towers group multiple boxes for the same purpose, and blocks collect towers for a high-level goal.\"},{\"question\":\"What problems with Indi Young’s Mental Model Generator does Skyline address?\",\"answer\":\"The presentation lists issues such as counterintuitive usage, weak GUI design, faulty sheet re-upload, invalid SVGs, limited personalization options, no real-time editing, and incomplete functionality. Skyline replaces this with improved reliability, design, usability, and additional editing and download capabilities.\"}]","Skyline - Mental Model Diagram Generator - Group 1 - 28 Jan 2025 | PDF",1792967424,43]