SlideShare ist ein Scribd-Unternehmen logo
1 von 11
[object Object],[object Object],[object Object],[object Object]
Agenda ,[object Object],[object Object],[object Object],[object Object],[object Object]
What is a “Web Runtime”? A software   development environment   that lets developers use   standard web technology   to create first-class   applications
What’s in it for me?  Symbian Maemo Desktop Cross-platform apps Reuse Web content ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Available now on  over 30 Symbian models Over 30 Symbian devices launched, announced or upcoming Broad-based Device Support on Symbian OS, S60 3.2 and 5.0 devices Latest Firmware Upgrade on Symbian OS, S60 3.1 devices
Available next on  Maemo Q4 2009  Q1 2010  Q2 2010  Alpha: Nokia Web Runtime for Maemo 6 Beta: Nokia Web Runtime for Maemo 6 Today: Web Runtime for 10s of millions of Symbian devices
Easy tools  turn designers into app developers ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],WRT plug-ins and extension Widgets ,[object Object],[object Object],[object Object]
Have 60 seconds ? ,[object Object],[object Object],[object Object]
How to:  support screen sizes & orientations .button { width: 116px; height: 37px; background: url(images/button_bg.png) no-repeat; color: #ffffff; font-size: 20px; font-weight: bold; margin: 3px; padding-top: 12px; display: inline-block; text-align: center; } <link href=&quot;style.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;> <link href=&quot;style_small.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;> // Set the correct stylesheet depending on whether // we are running on bigger or smaller screens. applyCorrectStyles: function() { var largeScreen = Helper.isLargeScreen(); document.styleSheets[0].disabled = !largeScreen; document.styleSheets[1].disabled = largeScreen; } .button { width: 80px; height: 25px; background: url(images/small_button_bg.png) no-repeat; color: #ffffff; font-size: 14px; font-weight: bold; margin: 2px; padding-top: 9px; display: inline-block; text-align: center; } 1. Define styles for screen sizes and orientations 2. Add the style sheets to your HTML file 3. Choose the right one based on the screen size CSS CSS HTML JS
[object Object],[object Object],[object Object],[object Object],[object Object],Platform Services  add context to web content System Messaging Calendar Media Contacts Location Nokia 5800 XpressMusic Camera (beta) var calendarObj= com.nokia.device.load(&quot;&quot;, &quot;com.nokia.device.calendar&quot;, &quot;&quot;); var meetTime = { start: startDateTime, end: endDateTime }; var meetingEntry = { type: &quot;Meeting&quot;, summary: “Meeting summary”, time: meetTime, description: “Meeting description” }; var result = calendarObj.addEntry(meetingEntry);
What do you want in a widget? Want to hear more about Web widgets? 10 tips for Designing Mobile Widgets Rajesh Lal   Sunday, 12:30 pm, Room N810

Weitere ähnliche Inhalte

Andere mochten auch

Using mobile phones to enhance interaction in didactic teaching approaches
Using mobile phones to enhance interaction in didactic teaching approaches Using mobile phones to enhance interaction in didactic teaching approaches
Using mobile phones to enhance interaction in didactic teaching approaches Dick Ng'ambi
 
E Tqf Open Source Lms
E Tqf Open Source LmsE Tqf Open Source Lms
E Tqf Open Source LmsFIT Ltd
 
Heart Attack الازمة القلبية
Heart Attack الازمة القلبيةHeart Attack الازمة القلبية
Heart Attack الازمة القلبيةamr hassaan
 
Senior Executive
Senior ExecutiveSenior Executive
Senior ExecutiveGlenALewis
 
Cooperacion academica y educacion abierta
Cooperacion academica y educacion abiertaCooperacion academica y educacion abierta
Cooperacion academica y educacion abiertaFabio Nascimbeni
 
فلسفة النمل Ants
فلسفة النمل Antsفلسفة النمل Ants
فلسفة النمل Antsamr hassaan
 
How to Measure Inbound Markerting
How to Measure Inbound MarkertingHow to Measure Inbound Markerting
How to Measure Inbound MarkertingOptify
 
Wikipedia en de Koninklijke Bibliotheek: samen een wereldwijd bereik
Wikipedia en de Koninklijke Bibliotheek:  samen een wereldwijd bereik Wikipedia en de Koninklijke Bibliotheek:  samen een wereldwijd bereik
Wikipedia en de Koninklijke Bibliotheek: samen een wereldwijd bereik Olaf Janssen
 
πρώτα σχόλια για την διδακτέα ύλη φυσικησ και χημειασ του γυμνασίου 2012 13
πρώτα σχόλια για την διδακτέα  ύλη φυσικησ και χημειασ  του γυμνασίου 2012 13πρώτα σχόλια για την διδακτέα  ύλη φυσικησ και χημειασ  του γυμνασίου 2012 13
πρώτα σχόλια για την διδακτέα ύλη φυσικησ και χημειασ του γυμνασίου 2012 13Christos Gotzaridis
 
Maria Fojk Edu Learn Conference Presentation
Maria Fojk Edu Learn Conference PresentationMaria Fojk Edu Learn Conference Presentation
Maria Fojk Edu Learn Conference PresentationFIT Ltd
 

Andere mochten auch (15)

Using mobile phones to enhance interaction in didactic teaching approaches
Using mobile phones to enhance interaction in didactic teaching approaches Using mobile phones to enhance interaction in didactic teaching approaches
Using mobile phones to enhance interaction in didactic teaching approaches
 
Tutorial 4 isu n trenda
Tutorial 4 isu n trendaTutorial 4 isu n trenda
Tutorial 4 isu n trenda
 
Anschp18
Anschp18Anschp18
Anschp18
 
E Tqf Open Source Lms
E Tqf Open Source LmsE Tqf Open Source Lms
E Tqf Open Source Lms
 
Heart Attack الازمة القلبية
Heart Attack الازمة القلبيةHeart Attack الازمة القلبية
Heart Attack الازمة القلبية
 
Senior Executive
Senior ExecutiveSenior Executive
Senior Executive
 
Cooperacion academica y educacion abierta
Cooperacion academica y educacion abiertaCooperacion academica y educacion abierta
Cooperacion academica y educacion abierta
 
Dillard bank on it
Dillard bank on itDillard bank on it
Dillard bank on it
 
فلسفة النمل Ants
فلسفة النمل Antsفلسفة النمل Ants
فلسفة النمل Ants
 
سهل وصعب
سهل وصعبسهل وصعب
سهل وصعب
 
actividad 12
actividad 12actividad 12
actividad 12
 
How to Measure Inbound Markerting
How to Measure Inbound MarkertingHow to Measure Inbound Markerting
How to Measure Inbound Markerting
 
Wikipedia en de Koninklijke Bibliotheek: samen een wereldwijd bereik
Wikipedia en de Koninklijke Bibliotheek:  samen een wereldwijd bereik Wikipedia en de Koninklijke Bibliotheek:  samen een wereldwijd bereik
Wikipedia en de Koninklijke Bibliotheek: samen een wereldwijd bereik
 
πρώτα σχόλια για την διδακτέα ύλη φυσικησ και χημειασ του γυμνασίου 2012 13
πρώτα σχόλια για την διδακτέα  ύλη φυσικησ και χημειασ  του γυμνασίου 2012 13πρώτα σχόλια για την διδακτέα  ύλη φυσικησ και χημειασ  του γυμνασίου 2012 13
πρώτα σχόλια για την διδακτέα ύλη φυσικησ και χημειασ του γυμνασίου 2012 13
 
Maria Fojk Edu Learn Conference Presentation
Maria Fojk Edu Learn Conference PresentationMaria Fojk Edu Learn Conference Presentation
Maria Fojk Edu Learn Conference Presentation
 

Kürzlich hochgeladen

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
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilDeveloping An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilV3cube
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsMaria Levchenko
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slidevu2urc
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUK Journal
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityPrincipled Technologies
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfhans926745
 

Kürzlich hochgeladen (20)

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
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilDeveloping An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 

Hands-on development with Nokia Web Runtime

  • 1.
  • 2.
  • 3. What is a “Web Runtime”? A software development environment that lets developers use standard web technology to create first-class applications
  • 4.
  • 5. Available now on over 30 Symbian models Over 30 Symbian devices launched, announced or upcoming Broad-based Device Support on Symbian OS, S60 3.2 and 5.0 devices Latest Firmware Upgrade on Symbian OS, S60 3.1 devices
  • 6. Available next on Maemo Q4 2009 Q1 2010 Q2 2010 Alpha: Nokia Web Runtime for Maemo 6 Beta: Nokia Web Runtime for Maemo 6 Today: Web Runtime for 10s of millions of Symbian devices
  • 7.
  • 8.
  • 9. How to: support screen sizes & orientations .button { width: 116px; height: 37px; background: url(images/button_bg.png) no-repeat; color: #ffffff; font-size: 20px; font-weight: bold; margin: 3px; padding-top: 12px; display: inline-block; text-align: center; } <link href=&quot;style.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;> <link href=&quot;style_small.css&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;> // Set the correct stylesheet depending on whether // we are running on bigger or smaller screens. applyCorrectStyles: function() { var largeScreen = Helper.isLargeScreen(); document.styleSheets[0].disabled = !largeScreen; document.styleSheets[1].disabled = largeScreen; } .button { width: 80px; height: 25px; background: url(images/small_button_bg.png) no-repeat; color: #ffffff; font-size: 14px; font-weight: bold; margin: 2px; padding-top: 9px; display: inline-block; text-align: center; } 1. Define styles for screen sizes and orientations 2. Add the style sheets to your HTML file 3. Choose the right one based on the screen size CSS CSS HTML JS
  • 10.
  • 11. What do you want in a widget? Want to hear more about Web widgets? 10 tips for Designing Mobile Widgets Rajesh Lal Sunday, 12:30 pm, Room N810

Hinweis der Redaktion

  1. Last modified October 1, 2009 Change log: 1 Oct 2009: Removed device image in slide 8 Reordered slides: “how it works” before PS slide. Removed PS 2.0 slide, added note about beta to PS slide. Replaced background image in last slide, removed Nokia logo. Added roadmap slide
  2. Web content rendering and AJAX programming (HTML, CSS, JavaScript) Handling media content natively or with the help of scriptable plug-ins JavaScript interfaces to on-device functionality with access control (security) Ability to create an application-like experience without browser UI Context aware with platform services (with Symbian OS, S60 5th edition 5.0) Web Runtime = DOM + CSS + JavaScript engine + JavaScript Service API binding + Netscape plug-in RIA (Rich Internet Applications) = Webkit + QT + codecs (platform services) Context Aware with Platform Services (with Symbian OS, S60 5th edition 5.0 ): Location and Landmarks Contacts, Calendar and Messaging Media Management Application Manager, System Info, Logging, and Sensors More about this on slide #25
  3. What’s in it for me as a Maemo developer? For native developers, WRT can be used for rapid prototyping and concept development, as it uses standard HTML and interpreted JavaScript. No need for compilation, just write and deploy. For Web services, you can reuse Web content and Web development skills to create first-class applications
  4. Nokia’s Web Runtime is currently supported in over 30 models of Symbian S60 devices, and not just from Nokia. For example, there are several Samsung and LG devices, built on the same Symbian OS, that support WRT.
  5. S60 and Aptana &amp; Dreamweaver plugin with S60.wgz support available today. Harmattan a.k.a. Maemo 6 will have WRT as a key part of the platform.
  6. We support our WRT with tools, aimed at the needs of existing Web developers. Web developers use Web tools, so we are reaching out to them through the tools they already know and use. Opportunity for designers and developers to collaborate on the same projects: Designers use Dreamweaver and other popular graphic design tools (like Photoshop) to create widget design and user interface. JavaScript developers import those graphics into Aptana Studio and add the application logic
  7. Ref. Janne Heikinen’s keynote about importance of supporting portrait and landscape in Maemo 6 Here’s an example of how HTML, CSS, and JavaScript come together to make a Web application work on devices with different screen sizes Several advantages of this approach: You can write your application independent of the UI design. A professional designer can work on the look and feel in parallel, and just provide the style sheets It’s easy to test different UI options: just modify the style sheet and run the widget. No need to compile the program again. Leaves more time for iterative design Gets very close to “write once, run anywhere”: ship one version of your application that works in a large number of devices
  8. Web Runtime widgets can add device context and other data using JavaScript extensions that link to the underlying platform Platform Services supported in selected Symbian OS, S60 3.2 devices: We’re improving and expanding our support for these Platform Services, and are active in efforts to create common standards for these interfaces in the W3C PS 2.0 supports the W3C Geolocation API: http://dev.w3.org/geo/api/spec-source.html W3C Device APIs and Policy Working Group: http://www.w3.org/2009/05/DeviceAPICharter.html “ The mission of the Device APIs and Policy Working Group is to create client-side APIs that enable the development of web Applications and web Widgets that interact with devices services such as Calendar, Contacts, Camera, etc. Additionally, the group will produce a framework for the expression of security policies that govern access to security-critical APIs (such as the APIs listed previously). “ API’s submitted by Nokia: Calendar Camera Contacts (aka Address Book) Messaging System Information NOTE: Platform Services 1.0 will be deprecated in future releases of Nokia WRT, as Nokia moves to a more standards-compliant framework