Centre for Complex Cooperative SystemsUniversity of the West of England Home Page AMRC Research AMRC SEEDS Research SEEDS
Software Engineering Research Group - Centre for Complex Cooperative Systems
Text Only Site Map Text Only Site Map
Ajax and Web 2.0 - http://www.cems.uwe.ac.uk/amrc/seeds/Ajax/ajax.htm.
Explanation of Examples - http://www.cems.uwe.ac.uk/amrc/seeds/NewPaper/Explanation.htm.
Interactive SVG Examples - Interactive SVG Examples
Visualisation and Interaction - http://www.cems.uwe.ac.uk/~phale/#VisualisationandInteraction - Other Explanations and Examples.
Visualisation and Interaction Page - Visualisation and Interaction
Peter Hale Home - http://www.cems.uwe.ac.uk/~phale
Flash - http://www.cems.uwe.ac.uk/~phale/#Flash
I'm developing a survey on usability, I don't think it's quite right yet, but I would still welcome anyone using it to leave feedback on my research topic (or about the survey) - Click Here to take part in a usability survey, and support my PhD research, for anyone who does not want to remain anonymous, I would be pleased to take an interest in their research.
The survey compares these interfaces -
Taxonomy - http://www.cems.uwe.ac.uk/~phale/ELearning/ELearningDemonstration1.htm.
Diagrammatic - http://www.cems.uwe.ac.uk/~phale/ELearning/ELearningDemonstration2.htm.
And asks for further advice on end-user programming.
I'm interested in feedback from anyone, whatever their level of IT skills.
Survey Results - http://www.cems.uwe.ac.uk/amrc/seeds/EndUserProgramming.htm#SurveyResults - http://www.toluna.com/polls/37921/Do_You_Think_End-User_Programming_can_be_made_possible?.
An XML Taxonomy for each type of information can be output automatically from Protege and DecisionPro and contribute towards an overall Ontology. The XML can then be displayed on the web using a Flash program created by (Rhodes et al., 2002). This creates a tree with a three dimensional look and a use of colour, shading, and movement of the nodes that makes it an intuitive user interface that is easy to navigate. When a node is chosen, this is moved to the centre of the display and all the other nodes are moved or rotated to position themselves in relation to it. Clicking on the circle above the title on each node allows the user to see the detailed information contained in that node.
This interface is illustrated in the example below.
Click on the Components, or Materials Tab to see the visual representation.
Flash HCI Example Ontology Components and Materials |
Flash Human Computer Interface Example
This example was created based on Rhodes, G., Macdonald, J., Jokol, K., Prudence, P., Aylward, P., Shepherd, R., Yard, T., 2002. A Flash Family Tree, in: Flash MX Application and Interface Design Flash MX Application and Interface Design.
This is a branching hierarchical structure to display components and materials. Explore the structure, by rotating and expanding the nodes, to see how we could use such a system to display a large amount of information. Try opening a node to access more information and then using the combo boxes to navigate to a different node. This is achieved by clicking on the circle at the top of the node. Once you close this interface, the tree structure has been updated to your new position.
I reused it from an online example that I found here - http://www.friendsofed.com/book.html?isbn=1590591585 because the design was so good. What I did was change the XML files that held the data. So what I'd advise is to go to the page http://www.friendsofed.com/book.html?isbn=1590591585 and go through the tutorial in the sample chapter to understand the structure of the XML files and have enough understanding of the Flash code to be able to change it as necessary to display your amended XML files. Their example is of a family tree of Greek gods. That way you will have a working example with your own information in it.
I haven't tried converting my examples to new applications such as Flex2. I experimented with Flex2 briefly, and would want to use it again, but I'm writing my PhD thesis so not producing much new at present. Anyone who goes through the tutorial, and maybe the book as well should be able to know enough about how this example works to begin reproducing the own example in Flex2 or other applications step by step.
The code which the Flash tree reads is XML but my server will not render XML, so the source should begin with a declaration such as <?xml version="1.0" standalone="no"?> and end with </xml>. Clicking on Source displays all the XML in between these tags.
Flash Interactive Tree - With short explanation of use for E-Learning - http://www.cems.uwe.ac.uk/~phale/ELearning/ELearningDemonstration1.htm.
Flash XML Source Code Source
Flash and SVG (Scalable Vector Graphics) Article - Visual Editor for SVG? (Scalable Vector Graphics) - Peter Hale - Article from my Blog.
Flash movie that presents the concepts behind my work - User Driven Modelling Demonstration.
A Flash Family Tree, in: Flash MX Application and Interface Design Flash MX Application and Interface Design. - Rhodes, G., Macdonald, J., Jokol, K., Prudence, P., Aylward, P., Shepherd, R., Yard, T., 2002.
Adobe Apollo - Apollo - From Adobe Labs - Apollo is a cross-OS runtime that allows developers to leverage their existing web development skills (Flash, Flex, HTML, Ajax) to build and deploy desktop RIA's (Rich Internet Applications.
Adobe Flex 2 - Review - Review: A Look Under The Hood At Adobe Flex 2 - By Mario Morejon, CRN Test Center - http://www.adobe.com/products/flex/.
Flash and SVG (Scalable Vector Graphics) Article - Visual Editor for SVG? (Scalable Vector Graphics) - Peter Hale - Article from my Blog.
Flash Player 9 Update - http://labs.adobe.com/technologies/flashplayer9/.
Flash to the future - http://news.bbc.co.uk/1/hi/technology/6169853.stm - By Rami Tzabar - BBC World Service's Digital Planet - 12th December 2006 - Depending on how you see it, Flash is either the whizzy application that brings websites to life with fabulous animations, or the thing that makes websites annoyingly slow to download when all you really want is just to get a bit of information and move on.
Flex 2 Example Application - A Demonstration application built on Flex 2 - Adobe Demonstration.
Flex 2: Rich Internet Applications in a Flash! - http://www.sitepoint.com/article/flex-2-internet-applications - By Josh Tynjala.
Flex 2 - UWE Example Built Using Sitepoint Tutorial - http://www.cems.uwe.ac.uk/amrc/AMRCMembers/bin/AMRCMembers.html - Member Profile Viewer/Editor.
Improved Flash indexing - Google - http://googlewebmastercentral.blogspot.com/2008/06/improved-flash-indexing.html - We've received numerous requests to improve our indexing of Adobe Flash files. Today, Ron Adler and Janis Stipins-software engineers on our indexing team-will provide us with more in-depth information about our recent announcement that we've greatly improved our ability to index Flash. - Monday, June 30, 2008 - Written by Ron Adler, Janis Stipins, and Maile Ohye.
Optimizing Flash files for the search engines - Site Reference - Michael Goldstein.
TomDownload - TomDownload - Sothink SWF Quicker.
Explanation of Examples - http://www.cems.uwe.ac.uk/amrc/seeds/NewPaper/Explanation.htm.
Interactive SVG Examples - Interactive SVG Examples
Richard Tann - http://www.richtann.com/ - Welcome to my showreel page, please choose a section below.
Richard Tann UWE - http://www.richtann.com/2dExamples/Roug%20Guide%20Template6.html - A template designed to outline the structure for a suite of self contained interactive learning modules.
Richard Tann UWE - http://www.richtann.com/2dExamples/pharos3.html - Interactive manual for new university students.
Richard Tann UWE - http://www.richtann.com/2dExamples/graph.html - Mathematical Functions - An Example using Actionscript to model functions and dynamically redraw according to user interaction.
Visualisation and Interaction - http://www.cems.uwe.ac.uk/~phale/#VisualisationandInteraction - Other Explanations and Examples.
Visualisation and Interaction Page - Visualisation and Interaction
ACM Computing Surveys - Strategic Directions in Computing Research Working Group on Computational Geometry - Graph Drawing and Information Visualization - I G Tollis.
Automated Tool Support for a Large Scale Diagramming Tool - http://www.semdesigns.com/Company/Publications/GRACE-Quigley.pdf - Aaron J. Quigley - Dept. of Computer Science and Software Engineering, University of Newcastle, Callaghan NSW.
CALT Encyclopedia - http://www.calt.insead.edu/Encyclopedia/?cognitive%20maps - cognitive maps.
CALT WebLog - http://www.calt.insead.edu/blog/index.php/2006/07/05/network-visualization/ - The INSEAD Centre for Advanced Learning Technologies 's WebBlog - Network Visualization.
CALT WebLog - http://www.calt.insead.edu/tools/fusioncharts/chartforeis/showmap.php - Prototype for creating organizational chart.
Cambridge University - Viewpoints and Views in Engineering Change ManagementInternational Conference on Engineering Design - René Keller, Claudia M. Eckert, P. John Clarkson Engineering Design Centre.
der-mo.net - http://der-mo.net/ - Interaction Design.
der-mo.net - http://der-mo.net/relationBrowser/ - Relation Browser.
iCampus - The MIT-Microsoft Alliance - http://icampus.mit.edu/projects/MagicPaper.shtml - Project - Magic Paper: drawing out ideas.
Kirupa.com - http://www.kirupa.com/developer/flash/index.htm#Basic - Flash Tutorials.
Knowledge Map - http://www.ductil.org/mapa/english/.
Lanner Group and Ford - http://www.lanner.com/products/whitepapers/virtualfactories.pdf - Anthony P. Waller, John Ladbrook - Experiencing Virtual Factories of the Future.
Outfoxed - Personalize your internet - http://getoutfoxed.com/visualization - Informer network visualization.
Periodic Table: built with Flash, XML, webMathematica - http://www.galaxygoo.org/biochem/PeriodicTable.htm - GalaxyGoo - This project demonstrates the combination of Flash(MX), XML, and webMathematica. - In the flash application, cells for each element are dynamically generated and arranged on the stage. Basic information about each element (the atomic number, element symbol, and element name) is passed to the flash application from an XML document, and displayed. - by Kristin Henry and Brian Higgins.
Recap - https://www.recap.com/sitehome.nsf/directors?openform - Power Brokers of Biotech.
Robert Bowdidge's Research Page - Research - Star Diagram - Restructuring tool and star diagrams for program code.
Teaching Geoscience with Visualizations: Using Images, Animations, and Models Effectively - References about Teaching and Learning with Visualizations - Link to Visualization Resources.
University of Victoria, University of Grenoble - Visualization in the Context of Model Driven Engineering - R. Ian Bull,Jean-Marie Favre.
Using Visualization Tools to Gain Insight Into Your Data - http://www.cs.umd.edu/hcil/treemap/SPEplaisant-final.pdf - ChevronTexaco - the SPE Annual Technical Conference and Exhibition held in Denver, Colorado, U.S.A., 5 - 8 October 2003.
University of Maryland, College Park - http://www.cs.umd.edu/class/spring2006/cmsc838s/viz4all/v4a_vis.html - Viz4All.
University of Maryland - Human Computer Interaction Lab - http://www.cs.umd.edu/hcil/research/visualization.shtml - Visualization.
Visual Complexity - http://www.visualcomplexity.com/vc/.
vizster - http://jheer.org/vizster/ - Visualizing Online social networks.
SEEDS Page - SEEDS Home Page
Software Engineering Research Group - http://www.cems.uwe.ac.uk/cccs/researchgroup.php?menu=off&group=serg - SERG's mission is to bridge the gap between software engineering research and its application to different disciplines.
Peter Home Page - Peter Hale Home Page
This page has been Accessed
times since August 2006.
Invalid XHTML 1.0 due to use of embed tag for Flash click here for explanation.
|
Terms and conditions Privacy policy Accessibility © 2005 University of the West of England, Bristol (except acknowledged extracts from newspapers, journals, etc) |