SlideShare a Scribd company logo
FEDERAL UNIVERSITY OF SÃO CARLOS
CENTER OF SCIENCES AND TECHNOLOGY
GRADUATE PROGRAM IN COMPUTER SCIENCE
Carlos Eduardo Cirilo
Antonio Francisco do Prado
Wanderley L. de Souza
Luciana Aparecida Martinez Zaina
MODEL DRIVEN RICHUBI - A MODEL
DRIVEN PROCESS FOR BUILDING RICH
INTERFACES OF CONTEXT-SENSITIVE
UBIQUITOUS APPLICATIONS
Software Engineering
Group
1
Available in: http://dx.doi.org/10.1145/1878450.1878485
2
MOTIVATION
 Rich interfaces
• The main proposal is to
provide the user with a rich
interaction
o Rich interface
components: multimedia,
drag & drop, sliding panels,
auto-completion fields,
online spreadsheets, etc...
• Better responsiveness and
performance
o Asynchronous
communication
o Avoid unnecessary page
reloads
• Better user interaction
(facilitates and motivates)
3
MOTIVATION
 Ubiquitous Computing
Computing has enabled users easy access to services and
applications from anywhere, anytime, and using any device.
 Heterogeneity of access devices
 Need to adapt applications’ interfaces
4
GOALS OF THIS PAPER
 To define a model-driven process (Model Driven RichUbi)
 Support to the development of rich interfaces of context-
sensitive ubiquitous applications
 Based on the conceptions of Domain-Specific Modeling (DSM)
 Interfaces modeling based on a rich interface components
metamodel
 Hides low level details
 Facilitates communication between users and developers
 Users can understand technical issues better and suggest
improvements directly on the conceptual level
 Partial code generation to different platforms
 Development of code generators and dynamic content adapters
5
CONCEPTS
 Model-Driven Development.
Interface adaptation strategies.
6
MODEL-DRIVEN DEVELOPMENT
 Focuses on models instead of source code
 Raises the level of abstraction during the development
 Applies appropriate model-to-code (M2C) transformations to
generate the entire or most of the code for different platforms
The methodology to user interface:
 Model-Based User Interface Development :
 Definition of the different aspects of user interfaces
(presentation, dialog, user tasks structure) in an abstract
way, regardless the implementation platform
7
MODEL-DRIVEN DEVELOPMENT
Domain Specific Modeling (DSM)
 Models are built by using Domain Specific Languages
(DSLs), which can be defined through metamodels that
represent the knowledge of a particular domain
 Reduces the effort in translating the concepts of problem
domain into concepts of the solution domain
 The interface models are created in a more intuitive way
and are less associated with the technical details of
implementation
8
INTERFACE ADAPTATION
STRATEGIES
9
INTERFACE ADAPTATION
STRATEGIES
10
MODEL DRIVEN RICHUBI
 MDD (DSM) Rich Interfaces
Focuses on rich interface domain in order to support the
development of rich interfaces for different platforms
 Modeling is performed from a rich interface components
metamodel
 Employs a hybrid adaptation strategy:
 Requirements are mapped into a few generic interface
versions, each being appropriate for a particular group of
devices (static adaptation)
 Dynamic content adapters allow, at runtime, to select the
version that best fits the device profile, and to adapt the
code snippets to meet the characteristics of the access
device (dynamic adaptation)
11
MODEL DRIVEN RICHUBI
 Process Overview
12
DOMAIN ENGINEERING
 Construction of the Rich Interface Components Metamodel
 The requirements of rich interface domain are elicited, specified,
analyzed and represented in a rich interface components metamodel
Interface components
identified in
environments of Web
development
(Dreamweaver, MS
Visual Studio)
13
DOMAIN ENGINEERING
 Construction of the Model to Code Transformations
 The transformations that will be applied to the interface models for
code generation during the AE step are built
Construction of Content Adapters
 Building of the content adapters that will accomplish the dynamic
adaptation of the interface components according to the device profile
during the application execution
14
MODEL DRIVEN RICHUBI
 Process Overview
15
APPLICATION ENGINEERING
 Ubiquitous applications with rich interfaces are built by reusing the
artifacts produced in the DE
 Follows the Analysis, Design, Implementation and Testing disciplines
 Case Study: Web module of the Ambulance Space Positioning System
(ASPS)
 ASPS emerged from an experimental study which aimed at
investigating the use of the signals from GSM antennas for the
location of people or objects
 ASPS allows the fleet management team to monitor the mobility of
the ambulances
16
APPLICATION ENGINEERING
 Design
 ASPS specifications refinement
 Modeling of the application interfaces as an instance of the
metamodel
17
APPLICATION ENGINEERING
 Implementation and Testing
 Partial code generation from modeling by using the M2C
transformations
 Content adapter reuse
18
CONCLUSIONS AND FURTHER
WORK
 Main contributions
 Study and research on the use of DSM for building rich interfaces of
context-sensitive ubiquitous applications;
 Specification of a rich interface components metamodel and M2C
transformations to support the modeling and code generation for
different platforms; and
 Content adaptation carried out in a hybrid fashion with the use of
context.
 Future Work
 Addition of new rich interface components to the metamodel;
 Construction of a graphical notation for the metamodel in order to
turn modeling more user-friendly; and
 Optimizations in the M2C transformations that allow further
automation of code generation.
19
Thank you!
Carlos E. Cirilo
carlos_cirilo@dc.ufscar.br
Antonio F. Prado
prado@dc.ufscar.br
Luciana A. M. Zaina
lzaina@ufscar.br
http://www.ges.dc.ufscar.br
Wanderley L. de Souza
desouza@dc.ufscar.br

More Related Content

Similar to Model driven RichUbi: a model driven process for building rich interfaces of context-sensitive ubiquitous applications (20)

PPTX
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
Amit Sheth
 
PPTX
UGIdotNET App Modernisation Keynote
Lorenzo Barbieri
 
PDF
RCAMM_IEEE_RAICS_2013_6745453
Shekhar Parkhi
 
PDF
IRJET- Cross-Platform Supported E-Learning Mobile Application
IRJET Journal
 
DOCX
Jonathan Terry's Resume
jcterry
 
PDF
PhD thesis
Stefano Tranquillini
 
PDF
Top 15 Cross-Platform App Development Frameworks in 2025.pdf
Cubix Global
 
PDF
Creating Scalable and Secure Applications with Cutting-Edge Application Devel...
GauriKale30
 
PPTX
PPt Presentation for a quiz website with a frontend as well as backend
ambermanglani143143
 
DOCX
What is Mendix and the concept of low-code development.docx
Technogeeks
 
PDF
A methodology for model driven multiplatform mobile application development
IAEME Publication
 
PDF
A methodology for model driven multiplatform mobile application development
IAEME Publication
 
PDF
Ernest Morariu
ernestmorariu
 
PDF
Innovation in Cross-Platform App Development.pdf
jennyaistechnolabs
 
DOCX
Development of Multiplatform CMS System with Zend Framework
Sinisa Vukovic
 
PPTX
App Modernization: From 0 to Hero
Lorenzo Barbieri
 
PDF
Scaling frontend applications with micro-frontends Presentation.pdf
KatamaRajuBandigari1
 
PDF
A Deep Dive into Android App Development 2.0.pdf
lubnayasminsebl
 
PDF
Build Innovative Web Applications with Full Stack Development Know -123.pdf
Uncodemy
 
PDF
Cookbook for Building An App
Manish Jain
 
MobiCloud: Towards Cloud Mobile Hybrid Application Generation using Semantica...
Amit Sheth
 
UGIdotNET App Modernisation Keynote
Lorenzo Barbieri
 
RCAMM_IEEE_RAICS_2013_6745453
Shekhar Parkhi
 
IRJET- Cross-Platform Supported E-Learning Mobile Application
IRJET Journal
 
Jonathan Terry's Resume
jcterry
 
Top 15 Cross-Platform App Development Frameworks in 2025.pdf
Cubix Global
 
Creating Scalable and Secure Applications with Cutting-Edge Application Devel...
GauriKale30
 
PPt Presentation for a quiz website with a frontend as well as backend
ambermanglani143143
 
What is Mendix and the concept of low-code development.docx
Technogeeks
 
A methodology for model driven multiplatform mobile application development
IAEME Publication
 
A methodology for model driven multiplatform mobile application development
IAEME Publication
 
Ernest Morariu
ernestmorariu
 
Innovation in Cross-Platform App Development.pdf
jennyaistechnolabs
 
Development of Multiplatform CMS System with Zend Framework
Sinisa Vukovic
 
App Modernization: From 0 to Hero
Lorenzo Barbieri
 
Scaling frontend applications with micro-frontends Presentation.pdf
KatamaRajuBandigari1
 
A Deep Dive into Android App Development 2.0.pdf
lubnayasminsebl
 
Build Innovative Web Applications with Full Stack Development Know -123.pdf
Uncodemy
 
Cookbook for Building An App
Manish Jain
 

More from Luciana Zaina (18)

PDF
Adding user experience aspects to the writing of user stories
Luciana Zaina
 
PDF
A experiência é do usuário ou do designer e do desenvolvedor ? Diferentes len...
Luciana Zaina
 
PDF
A design methodology for user-centered innovation in the software development...
Luciana Zaina
 
PPT
Um ambiente colaborativo para suporte ao comércio na Universidade
Luciana Zaina
 
PPTX
Compilador Web: uma Experiência Interdisciplinar entre as Disciplinas de Enge...
Luciana Zaina
 
PPT
Classification of learning profile based on categories of student preferences
Luciana Zaina
 
PPT
Learning objects retrieval from contextual analysis of user preferences to en...
Luciana Zaina
 
PPT
An Approach for Supporting P2P Collaborative Communication Based on Learning ...
Luciana Zaina
 
PPT
Adaptive learning in the educational e-LORS system: an approach based on pref...
Luciana Zaina
 
PPT
TOWARDS A HYBRID APPROACH FOR ADAPTING WEB GRAPHICAL USER INTERFACES TO HETER...
Luciana Zaina
 
PPT
Experimentation of the Model Driven RichUbi Process in the Adaptive Rich Inte...
Luciana Zaina
 
PPT
Model Driven RichUbi - A Model-Driven Process to Construct Rich Interfaces fo...
Luciana Zaina
 
PPTX
Identificação das necessidades de interação dos usuários em sistemas ERP: pro...
Luciana Zaina
 
PPTX
Aprendendo História através de Museus Virtuais: uma parceria entre Professore...
Luciana Zaina
 
PPT
Cataloguing of learning objects using social tagging
Luciana Zaina
 
PPT
The use of social tagging to support the cataloguing of learning objects
Luciana Zaina
 
PPT
Interaction With Mobile Devices on Social Networks by Elderly People: A Surve...
Luciana Zaina
 
PPT
Interaction With Mobile Devices by Elderly People: The Brazilian Scenario
Luciana Zaina
 
Adding user experience aspects to the writing of user stories
Luciana Zaina
 
A experiência é do usuário ou do designer e do desenvolvedor ? Diferentes len...
Luciana Zaina
 
A design methodology for user-centered innovation in the software development...
Luciana Zaina
 
Um ambiente colaborativo para suporte ao comércio na Universidade
Luciana Zaina
 
Compilador Web: uma Experiência Interdisciplinar entre as Disciplinas de Enge...
Luciana Zaina
 
Classification of learning profile based on categories of student preferences
Luciana Zaina
 
Learning objects retrieval from contextual analysis of user preferences to en...
Luciana Zaina
 
An Approach for Supporting P2P Collaborative Communication Based on Learning ...
Luciana Zaina
 
Adaptive learning in the educational e-LORS system: an approach based on pref...
Luciana Zaina
 
TOWARDS A HYBRID APPROACH FOR ADAPTING WEB GRAPHICAL USER INTERFACES TO HETER...
Luciana Zaina
 
Experimentation of the Model Driven RichUbi Process in the Adaptive Rich Inte...
Luciana Zaina
 
Model Driven RichUbi - A Model-Driven Process to Construct Rich Interfaces fo...
Luciana Zaina
 
Identificação das necessidades de interação dos usuários em sistemas ERP: pro...
Luciana Zaina
 
Aprendendo História através de Museus Virtuais: uma parceria entre Professore...
Luciana Zaina
 
Cataloguing of learning objects using social tagging
Luciana Zaina
 
The use of social tagging to support the cataloguing of learning objects
Luciana Zaina
 
Interaction With Mobile Devices on Social Networks by Elderly People: A Surve...
Luciana Zaina
 
Interaction With Mobile Devices by Elderly People: The Brazilian Scenario
Luciana Zaina
 
Ad

Recently uploaded (20)

PPTX
WooCommerce Workshop: Bring Your Laptop
Laura Hartwig
 
PDF
Building Real-Time Digital Twins with IBM Maximo & ArcGIS Indoors
Safe Software
 
PDF
New from BookNet Canada for 2025: BNC BiblioShare - Tech Forum 2025
BookNet Canada
 
PDF
Smart Trailers 2025 Update with History and Overview
Paul Menig
 
PPTX
Building Search Using OpenSearch: Limitations and Workarounds
Sease
 
PDF
HCIP-Data Center Facility Deployment V2.0 Training Material (Without Remarks ...
mcastillo49
 
PDF
Bitcoin for Millennials podcast with Bram, Power Laws of Bitcoin
Stephen Perrenod
 
PDF
Reverse Engineering of Security Products: Developing an Advanced Microsoft De...
nwbxhhcyjv
 
PPTX
"Autonomy of LLM Agents: Current State and Future Prospects", Oles` Petriv
Fwdays
 
PDF
Timothy Rottach - Ramp up on AI Use Cases, from Vector Search to AI Agents wi...
AWS Chicago
 
PDF
HubSpot Main Hub: A Unified Growth Platform
Jaswinder Singh
 
PDF
"Beyond English: Navigating the Challenges of Building a Ukrainian-language R...
Fwdays
 
PDF
LLMs.txt: Easily Control How AI Crawls Your Site
Keploy
 
PDF
NewMind AI - Journal 100 Insights After The 100th Issue
NewMind AI
 
PDF
Presentation - Vibe Coding The Future of Tech
yanuarsinggih1
 
PPTX
UiPath Academic Alliance Educator Panels: Session 2 - Business Analyst Content
DianaGray10
 
PDF
Python basic programing language for automation
DanialHabibi2
 
PDF
Chris Elwell Woburn, MA - Passionate About IT Innovation
Chris Elwell Woburn, MA
 
PPTX
AI Penetration Testing Essentials: A Cybersecurity Guide for 2025
defencerabbit Team
 
PDF
CIFDAQ Weekly Market Wrap for 11th July 2025
CIFDAQ
 
WooCommerce Workshop: Bring Your Laptop
Laura Hartwig
 
Building Real-Time Digital Twins with IBM Maximo & ArcGIS Indoors
Safe Software
 
New from BookNet Canada for 2025: BNC BiblioShare - Tech Forum 2025
BookNet Canada
 
Smart Trailers 2025 Update with History and Overview
Paul Menig
 
Building Search Using OpenSearch: Limitations and Workarounds
Sease
 
HCIP-Data Center Facility Deployment V2.0 Training Material (Without Remarks ...
mcastillo49
 
Bitcoin for Millennials podcast with Bram, Power Laws of Bitcoin
Stephen Perrenod
 
Reverse Engineering of Security Products: Developing an Advanced Microsoft De...
nwbxhhcyjv
 
"Autonomy of LLM Agents: Current State and Future Prospects", Oles` Petriv
Fwdays
 
Timothy Rottach - Ramp up on AI Use Cases, from Vector Search to AI Agents wi...
AWS Chicago
 
HubSpot Main Hub: A Unified Growth Platform
Jaswinder Singh
 
"Beyond English: Navigating the Challenges of Building a Ukrainian-language R...
Fwdays
 
LLMs.txt: Easily Control How AI Crawls Your Site
Keploy
 
NewMind AI - Journal 100 Insights After The 100th Issue
NewMind AI
 
Presentation - Vibe Coding The Future of Tech
yanuarsinggih1
 
UiPath Academic Alliance Educator Panels: Session 2 - Business Analyst Content
DianaGray10
 
Python basic programing language for automation
DanialHabibi2
 
Chris Elwell Woburn, MA - Passionate About IT Innovation
Chris Elwell Woburn, MA
 
AI Penetration Testing Essentials: A Cybersecurity Guide for 2025
defencerabbit Team
 
CIFDAQ Weekly Market Wrap for 11th July 2025
CIFDAQ
 
Ad

Model driven RichUbi: a model driven process for building rich interfaces of context-sensitive ubiquitous applications

  • 1. FEDERAL UNIVERSITY OF SÃO CARLOS CENTER OF SCIENCES AND TECHNOLOGY GRADUATE PROGRAM IN COMPUTER SCIENCE Carlos Eduardo Cirilo Antonio Francisco do Prado Wanderley L. de Souza Luciana Aparecida Martinez Zaina MODEL DRIVEN RICHUBI - A MODEL DRIVEN PROCESS FOR BUILDING RICH INTERFACES OF CONTEXT-SENSITIVE UBIQUITOUS APPLICATIONS Software Engineering Group 1 Available in: http://dx.doi.org/10.1145/1878450.1878485
  • 2. 2 MOTIVATION  Rich interfaces • The main proposal is to provide the user with a rich interaction o Rich interface components: multimedia, drag & drop, sliding panels, auto-completion fields, online spreadsheets, etc... • Better responsiveness and performance o Asynchronous communication o Avoid unnecessary page reloads • Better user interaction (facilitates and motivates)
  • 3. 3 MOTIVATION  Ubiquitous Computing Computing has enabled users easy access to services and applications from anywhere, anytime, and using any device.  Heterogeneity of access devices  Need to adapt applications’ interfaces
  • 4. 4 GOALS OF THIS PAPER  To define a model-driven process (Model Driven RichUbi)  Support to the development of rich interfaces of context- sensitive ubiquitous applications  Based on the conceptions of Domain-Specific Modeling (DSM)  Interfaces modeling based on a rich interface components metamodel  Hides low level details  Facilitates communication between users and developers  Users can understand technical issues better and suggest improvements directly on the conceptual level  Partial code generation to different platforms  Development of code generators and dynamic content adapters
  • 6. 6 MODEL-DRIVEN DEVELOPMENT  Focuses on models instead of source code  Raises the level of abstraction during the development  Applies appropriate model-to-code (M2C) transformations to generate the entire or most of the code for different platforms The methodology to user interface:  Model-Based User Interface Development :  Definition of the different aspects of user interfaces (presentation, dialog, user tasks structure) in an abstract way, regardless the implementation platform
  • 7. 7 MODEL-DRIVEN DEVELOPMENT Domain Specific Modeling (DSM)  Models are built by using Domain Specific Languages (DSLs), which can be defined through metamodels that represent the knowledge of a particular domain  Reduces the effort in translating the concepts of problem domain into concepts of the solution domain  The interface models are created in a more intuitive way and are less associated with the technical details of implementation
  • 10. 10 MODEL DRIVEN RICHUBI  MDD (DSM) Rich Interfaces Focuses on rich interface domain in order to support the development of rich interfaces for different platforms  Modeling is performed from a rich interface components metamodel  Employs a hybrid adaptation strategy:  Requirements are mapped into a few generic interface versions, each being appropriate for a particular group of devices (static adaptation)  Dynamic content adapters allow, at runtime, to select the version that best fits the device profile, and to adapt the code snippets to meet the characteristics of the access device (dynamic adaptation)
  • 11. 11 MODEL DRIVEN RICHUBI  Process Overview
  • 12. 12 DOMAIN ENGINEERING  Construction of the Rich Interface Components Metamodel  The requirements of rich interface domain are elicited, specified, analyzed and represented in a rich interface components metamodel Interface components identified in environments of Web development (Dreamweaver, MS Visual Studio)
  • 13. 13 DOMAIN ENGINEERING  Construction of the Model to Code Transformations  The transformations that will be applied to the interface models for code generation during the AE step are built Construction of Content Adapters  Building of the content adapters that will accomplish the dynamic adaptation of the interface components according to the device profile during the application execution
  • 14. 14 MODEL DRIVEN RICHUBI  Process Overview
  • 15. 15 APPLICATION ENGINEERING  Ubiquitous applications with rich interfaces are built by reusing the artifacts produced in the DE  Follows the Analysis, Design, Implementation and Testing disciplines  Case Study: Web module of the Ambulance Space Positioning System (ASPS)  ASPS emerged from an experimental study which aimed at investigating the use of the signals from GSM antennas for the location of people or objects  ASPS allows the fleet management team to monitor the mobility of the ambulances
  • 16. 16 APPLICATION ENGINEERING  Design  ASPS specifications refinement  Modeling of the application interfaces as an instance of the metamodel
  • 17. 17 APPLICATION ENGINEERING  Implementation and Testing  Partial code generation from modeling by using the M2C transformations  Content adapter reuse
  • 18. 18 CONCLUSIONS AND FURTHER WORK  Main contributions  Study and research on the use of DSM for building rich interfaces of context-sensitive ubiquitous applications;  Specification of a rich interface components metamodel and M2C transformations to support the modeling and code generation for different platforms; and  Content adaptation carried out in a hybrid fashion with the use of context.  Future Work  Addition of new rich interface components to the metamodel;  Construction of a graphical notation for the metamodel in order to turn modeling more user-friendly; and  Optimizations in the M2C transformations that allow further automation of code generation.
  • 19. 19 Thank you! Carlos E. Cirilo [email protected] Antonio F. Prado [email protected] Luciana A. M. Zaina [email protected] http://www.ges.dc.ufscar.br Wanderley L. de Souza [email protected]

Editor's Notes

  • #3: The Rich interfaces main proposal is to provide the user with a rich interaction. A imagem mostra um exemplo de interface rica, com recursos auto-completar (campo para busca de músicas no canto superior direito), componente de reprodução de áudio e vídeos, painel de abas (menu superior), e leiaute rico. No campo de busca de músicas, à medida que o usuário insere valores no campo, requisições assíncronas são enviadas ao servidor e retornadas as sugestões ao usuário, sem que o mesmo tenha que aguardar a resposta (ou seja, ele continua interagindo com a aplicação mesmo enquanto sua requisição está sendo processada – modelo assíncrono de comunicação – uso de AJAX).
  • #4: Ubiquitous Computing has enabled users easy access to services and applications from anywhere, anytime, and using any device.
  • #5: Pelo fato de os modelos (nos quais os requisitos da aplicação são mapeados em componentes de interfaces) serem elaborados na mesma linguagem e jargão do domínio, a comunicação entre os usuários e os desenvolvedores torna-se simplificada (o usuário sabe que o requisito X foi mapeado para o componente painel de aba, por exemplo). Os usuários podem sugerir melhorias diretamente nos modelos. Posteriormente, qdo o modelo tiver completo, aplica-se as transformações modelo-para-código apropriadas (geradores de código), para gerar versões estáticas da interface para diferentes tecnologias. Com o uso dos adaptadores dinâmicos de conteúdo desenvolvidos no processo é possível identificar o dispositivo de acesso, escolher a versão mais apropriada da interface para aquele dispositivo, e refina-la ainda mais conforme as peculiaridades do dispositivo de acesso identificado.
  • #6: Pelo fato de os modelos (nos quais os requisitos da aplicação são mapeados em componentes de interfaces) serem elaborados na mesma linguagem e jargão do domínio, a comunicação entre os usuários e os desenvolvedores torna-se simplificada (o usuário sabe que o requisito X foi mapeado para o componente painel de aba, por exemplo). Os usuários podem sugerir melhorias diretamente nos modelos. Posteriormente, qdo o modelo tiver completo, aplica-se as transformações modelo-para-código apropriadas (geradores de código), para gerar versões estáticas da interface para diferentes tecnologias. Com o uso dos adaptadores dinâmicos de conteúdo desenvolvidos no processo é possível identificar o dispositivo de acesso, escolher a versão mais apropriada da interface para aquele dispositivo, e refina-la ainda mais conforme as peculiaridades do dispositivo de acesso identificado.
  • #11: A parte da adaptação estática é facilitada com a geração de código a partir da modelagem para diferentes tecnologias (através do reúso do metamodelo e das transformações M2C) A parte da adaptação dinâmica é facilitada com o emprego dos adaptadores de conteúdo (através do reúso desses componentes)
  • #12: O processo é dividido nas etapas de ED e EA. Na ED constóem-se os artefatos para reúso (metamodelo, transformações M2C, e adaptadores de conteúdo). A EA constóem-se as interfaces ricas das aplicações ubíquas sensíveis ao contexto com o reúso dos artefatos previamente construídos na ED. Esses artefatos podem ser reutilizados em diferentes projetos na etapa de EA.
  • #13: A figura mostra um exemplo de especificação dos componentes de interface. À esquerda o diagrama de classes especificando alguns dos componentes de interface que foram identificados a partir de ambientes de desenvolvimento Web (Dreamweaver, MS VisualStudio...). À direita tem-se a representação dos componentes (em azul) no metamodelo extraídos a partir do diagrama de classes. O metamodelo foi especificado utilizando o Eclipse Modeling Framework (EMF).
  • #14: Pode-se criar transformações que geram código para diferentes tecnologias a partir do mesmo modelo (ex: XHTML para desktops e smartphones, WML, VoiceXML, HTML5 etc...) Template JET para a geração do código do componente de inerface rica TabbedPanel. Uso das funções da biblioteca jQuery para renderizar o painel de abas na saída (linhas 2-4), e uso de folhas de estilo pré-fabricadas para pré-formatação do leiaute da interface (atributo class da tag div na linha 6). As transformações também foram incorporadas à ferramenta MVCASE para suporte à geração de código na EA.
  • #15: O processo é dividido nas etapas de ED e EA. Na ED constóem-se os artefatos para reúso (metamodelo, transformações M2C, e adaptadores de conteúdo). A EA constóem-se as interfaces ricas das aplicações ubíquas sensíveis ao contexto com o reúso dos artefatos previamente construídos na ED. Esses artefatos podem ser reutilizados em diferentes projetos na etapa de EA.
  • #17: A figura ilustra como é feito o mapeamento dos requisitos para componentes de interface no modelo que satisfação esses requisitos. É ilustrado também a forma com que o metamodelo está sendo instanciado no backend.