SlideShare a Scribd company logo
1 of 22
How we created ‘De Kinderpuzzel’ Boris Rogge Metanous
Overview The idea & the project Functional design Graphical design Some code (application, controls, …) The results Lessonslearned Questions
The idea – De Kinderpuzzel Participants need to match kids and parents 32 kids – 7 couples Participants gather knowledge about the kids during a number of  assignments and lay out the puzzle at the end of each episode a Microsoft Surface is used to lay out  the puzzle
Why Microsoft Surface ? multi-user – parents can work together to lay out the puzzle intuitive – parents can lay out the puzzle without any education or training visual – ideal device for showing the  couples lay out the puzzle
The project Short term notice – 3 weeks for 2 applications one-time-use software – someshortcutswere taken Verystressed and occupiedproduction team onlyone face to face meeting Graphical design team that we had never met before Threedays of filmingonlocation
The functional design v1
V1
Functional design v1 – some issues too static couples can not be moved on the canvas kids can not be dragged onto the canvas not ‘surface-like’ not really multi-user
The functional design v2
Graphical design (v1, v2, ... )
V2
Some code
KidsPuzzleWindow
Code – KidsPuzzleWindow  SurfaceWindow Grid MediaElement ScatterView CoupleScatterViewItem KidsScatterViewItem CoupleScroller KidsListbox
CoupleScroller a = height of the curve b = position of the center of the peak c = width of the ’bell’ http://www.metanous.be/boblog/post/Creating-a-fish-eye-scrolling-panel.aspx
Code – CoupleScroller SurfaceScrollViewer ItemsControl CoupleList CoupleData
V2bis
V2final
Surface onlocation
Surface onlocation
raw footage
TV version

More Related Content

What's hot

Computer design cycle final
Computer design cycle finalComputer design cycle final
Computer design cycle finalMatt0313
 
Project management wisdom from the trenches
Project management wisdom from the trenchesProject management wisdom from the trenches
Project management wisdom from the trenchesSaumya Ganguly
 
1. solution design 1 design sprint
1. solution design 1  design sprint1. solution design 1  design sprint
1. solution design 1 design sprintKaline Mesquita
 
Startup shocker: Bootstrapping for the non-geek
Startup shocker: Bootstrapping for the non-geekStartup shocker: Bootstrapping for the non-geek
Startup shocker: Bootstrapping for the non-geekSaul Fleischman
 
Info session
Info sessionInfo session
Info sessionKateGrupp
 
Creating Innovative Interfaces using Design Thinking
Creating Innovative Interfaces using Design ThinkingCreating Innovative Interfaces using Design Thinking
Creating Innovative Interfaces using Design ThinkingDemian Borba
 
What I learned about innovation (Pragmatic Ideas)
What I learned about innovation (Pragmatic Ideas)What I learned about innovation (Pragmatic Ideas)
What I learned about innovation (Pragmatic Ideas)Lucian Ghinda
 
How to embed UX thinking in API design
How to embed UX thinking in API designHow to embed UX thinking in API design
How to embed UX thinking in API designstephshin
 
STEM and Authentic Projects
STEM and Authentic ProjectsSTEM and Authentic Projects
STEM and Authentic ProjectsDan Bowen
 

What's hot (9)

Computer design cycle final
Computer design cycle finalComputer design cycle final
Computer design cycle final
 
Project management wisdom from the trenches
Project management wisdom from the trenchesProject management wisdom from the trenches
Project management wisdom from the trenches
 
1. solution design 1 design sprint
1. solution design 1  design sprint1. solution design 1  design sprint
1. solution design 1 design sprint
 
Startup shocker: Bootstrapping for the non-geek
Startup shocker: Bootstrapping for the non-geekStartup shocker: Bootstrapping for the non-geek
Startup shocker: Bootstrapping for the non-geek
 
Info session
Info sessionInfo session
Info session
 
Creating Innovative Interfaces using Design Thinking
Creating Innovative Interfaces using Design ThinkingCreating Innovative Interfaces using Design Thinking
Creating Innovative Interfaces using Design Thinking
 
What I learned about innovation (Pragmatic Ideas)
What I learned about innovation (Pragmatic Ideas)What I learned about innovation (Pragmatic Ideas)
What I learned about innovation (Pragmatic Ideas)
 
How to embed UX thinking in API design
How to embed UX thinking in API designHow to embed UX thinking in API design
How to embed UX thinking in API design
 
STEM and Authentic Projects
STEM and Authentic ProjectsSTEM and Authentic Projects
STEM and Authentic Projects
 

Similar to How we created "De Kinderpuzzel"

Digital pi castlemilk case study
Digital pi castlemilk case studyDigital pi castlemilk case study
Digital pi castlemilk case studyColin Crook
 
e281 dmedia syllabus winter 2012
e281 dmedia syllabus winter 2012 e281 dmedia syllabus winter 2012
e281 dmedia syllabus winter 2012 Stanford dmedia
 
Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...
Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...
Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...Cathie Howe
 
CE Catalog 2016 -2017 low res
CE Catalog 2016 -2017 low resCE Catalog 2016 -2017 low res
CE Catalog 2016 -2017 low resJanee Johnson
 
Computers Instructional Tools
Computers Instructional ToolsComputers Instructional Tools
Computers Instructional Toolskirish43
 
You Scored a 3D Printer! Now What?
You Scored a 3D Printer! Now What?You Scored a 3D Printer! Now What?
You Scored a 3D Printer! Now What?Meredith Steele
 
Design Workshop at UI/UX Summit, Esri User Conference 2014
Design Workshop at UI/UX Summit, Esri User Conference 2014Design Workshop at UI/UX Summit, Esri User Conference 2014
Design Workshop at UI/UX Summit, Esri User Conference 2014Sneha Khullar
 
Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02
Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02
Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02Margarida Romero
 
Case study OOPS .pptx
Case study OOPS .pptxCase study OOPS .pptx
Case study OOPS .pptxssuserc6f5161
 
Project planning 101 for publicsectorpm v2
Project planning 101 for publicsectorpm v2Project planning 101 for publicsectorpm v2
Project planning 101 for publicsectorpm v22020 Vision Partnership
 
From Buildings to Software - Paving the way to construction
From Buildings to Software - Paving the way to constructionFrom Buildings to Software - Paving the way to construction
From Buildings to Software - Paving the way to constructionKaterina Skroumpelou
 
Originate - Think In Hours Not Sprints
Originate - Think In Hours Not SprintsOriginate - Think In Hours Not Sprints
Originate - Think In Hours Not SprintsRob Meadows
 
Introduction for Stop Motion
Introduction for Stop MotionIntroduction for Stop Motion
Introduction for Stop Motionday548
 
FETC 2015 Advanced Game Design Presentation - Workshop
FETC 2015 Advanced Game Design Presentation - WorkshopFETC 2015 Advanced Game Design Presentation - Workshop
FETC 2015 Advanced Game Design Presentation - WorkshopMike Ploor
 
User Experience 1: What is User Experience?
User Experience 1: What is User Experience?User Experience 1: What is User Experience?
User Experience 1: What is User Experience?Marc Miquel
 
4 Pillars - Presentation Notes
4 Pillars - Presentation Notes4 Pillars - Presentation Notes
4 Pillars - Presentation NotesElizabeth Harris
 

Similar to How we created "De Kinderpuzzel" (20)

Digital pi castlemilk case study
Digital pi castlemilk case studyDigital pi castlemilk case study
Digital pi castlemilk case study
 
TADCAD
TADCADTADCAD
TADCAD
 
e281 dmedia syllabus winter 2012
e281 dmedia syllabus winter 2012 e281 dmedia syllabus winter 2012
e281 dmedia syllabus winter 2012
 
Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...
Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...
Using Game Design & Virtual Worlds for Creation of Interesting & Engaging Lea...
 
CE Catalog 2016 -2017 low res
CE Catalog 2016 -2017 low resCE Catalog 2016 -2017 low res
CE Catalog 2016 -2017 low res
 
Computers Instructional Tools
Computers Instructional ToolsComputers Instructional Tools
Computers Instructional Tools
 
You Scored a 3D Printer! Now What?
You Scored a 3D Printer! Now What?You Scored a 3D Printer! Now What?
You Scored a 3D Printer! Now What?
 
Extensive portfolio
Extensive portfolioExtensive portfolio
Extensive portfolio
 
Proposal gcompris
Proposal gcomprisProposal gcompris
Proposal gcompris
 
Design Workshop at UI/UX Summit, Esri User Conference 2014
Design Workshop at UI/UX Summit, Esri User Conference 2014Design Workshop at UI/UX Summit, Esri User Conference 2014
Design Workshop at UI/UX Summit, Esri User Conference 2014
 
Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02
Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02
Romero & Vallerand (2016) Co-creative activities for the 21st century kids-R02
 
Case study OOPS .pptx
Case study OOPS .pptxCase study OOPS .pptx
Case study OOPS .pptx
 
Extensive Portfolio
Extensive PortfolioExtensive Portfolio
Extensive Portfolio
 
Project planning 101 for publicsectorpm v2
Project planning 101 for publicsectorpm v2Project planning 101 for publicsectorpm v2
Project planning 101 for publicsectorpm v2
 
From Buildings to Software - Paving the way to construction
From Buildings to Software - Paving the way to constructionFrom Buildings to Software - Paving the way to construction
From Buildings to Software - Paving the way to construction
 
Originate - Think In Hours Not Sprints
Originate - Think In Hours Not SprintsOriginate - Think In Hours Not Sprints
Originate - Think In Hours Not Sprints
 
Introduction for Stop Motion
Introduction for Stop MotionIntroduction for Stop Motion
Introduction for Stop Motion
 
FETC 2015 Advanced Game Design Presentation - Workshop
FETC 2015 Advanced Game Design Presentation - WorkshopFETC 2015 Advanced Game Design Presentation - Workshop
FETC 2015 Advanced Game Design Presentation - Workshop
 
User Experience 1: What is User Experience?
User Experience 1: What is User Experience?User Experience 1: What is User Experience?
User Experience 1: What is User Experience?
 
4 Pillars - Presentation Notes
4 Pillars - Presentation Notes4 Pillars - Presentation Notes
4 Pillars - Presentation Notes
 

Recently uploaded

Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101Paola De la Torre
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxMalak Abu Hammad
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksSoftradix Technologies
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking MenDelhi Call girls
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Patryk Bandurski
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticscarlostorres15106
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365
Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365
Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 3652toLead Limited
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersThousandEyes
 
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAzure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAndikSusilo4
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationRidwan Fadjar
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsMark Billinghurst
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 

Recently uploaded (20)

Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
 
08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men08448380779 Call Girls In Civil Lines Women Seeking Men
08448380779 Call Girls In Civil Lines Women Seeking Men
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
Integration and Automation in Practice: CI/CD in Mule Integration and Automat...
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmaticsKotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
Kotlin Multiplatform & Compose Multiplatform - Starter kit for pragmatics
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365
Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365
Tech-Forward - Achieving Business Readiness For Copilot in Microsoft 365
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
 
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAzure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & Application
 
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 PresentationMy Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
 
Human Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR SystemsHuman Factors of XR: Using Human Factors to Design XR Systems
Human Factors of XR: Using Human Factors to Design XR Systems
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 

How we created "De Kinderpuzzel"

  • 1. How we created ‘De Kinderpuzzel’ Boris Rogge Metanous
  • 2. Overview The idea & the project Functional design Graphical design Some code (application, controls, …) The results Lessonslearned Questions
  • 3. The idea – De Kinderpuzzel Participants need to match kids and parents 32 kids – 7 couples Participants gather knowledge about the kids during a number of assignments and lay out the puzzle at the end of each episode a Microsoft Surface is used to lay out the puzzle
  • 4. Why Microsoft Surface ? multi-user – parents can work together to lay out the puzzle intuitive – parents can lay out the puzzle without any education or training visual – ideal device for showing the couples lay out the puzzle
  • 5. The project Short term notice – 3 weeks for 2 applications one-time-use software – someshortcutswere taken Verystressed and occupiedproduction team onlyone face to face meeting Graphical design team that we had never met before Threedays of filmingonlocation
  • 7. V1
  • 8. Functional design v1 – some issues too static couples can not be moved on the canvas kids can not be dragged onto the canvas not ‘surface-like’ not really multi-user
  • 11. V2
  • 14. Code – KidsPuzzleWindow SurfaceWindow Grid MediaElement ScatterView CoupleScatterViewItem KidsScatterViewItem CoupleScroller KidsListbox
  • 15. CoupleScroller a = height of the curve b = position of the center of the peak c = width of the ’bell’ http://www.metanous.be/boblog/post/Creating-a-fish-eye-scrolling-panel.aspx
  • 16. Code – CoupleScroller SurfaceScrollViewer ItemsControl CoupleList CoupleData
  • 17. V2bis
  • 23. Lessons learned one and two finger gestures are not intuitive “reset to last position” would have been a time saving feature functional and graphical design should be finished first take a good book – there is a lot of waiting involved
  • 24. Questions Boris Rogge boris.rogge@metanous.be http://www.metanous.be/ Twitter: @roggeb