A pragmatic strategy for the mobile application life-cycle is an incremental product release process with a feedback loop that incorporates usage data to drive the priority and urgency of future app features, i.e., a data-driven, iterative process. The most important “guest shopper” feature of Mobile PetStore is the ability to browse the store’s animal inventory. Using the incremental release strategy, the app’s initial feature will be pet catalog browsing. After the initial app release, we will collect app download and usage data to determine the features to provide in future releases such as shopping cart, social media integration, etc.
Title: Browsing the Store Animal Inventory User Role: Guest Shopper Story: A user is able to browse the store’s animal inventory. The animal inventory is a hierarchy represented by a catalog that contains animals categorized by their type, e.g., fish, bird, dog. Each animal type or species of animal is a product in the catalog, e.g., gold fish, parakeet, poodle. The animal entity that a store stocks and sells is known as an item and is a specific type of product, e.g., male goldfish or female black poodle. The guest shopper accesses the shop's animal catalog from his smartphone or tablet and drills down through the hierarchy of categories, products and items to find the information he is seeking. The user interface should make maximum use of the available display space.
Key Design Constraints - The Bottom Line
A primary challenge when mobilizing a legacy application is the technical constraints you must work with as you build mobile app features. In many cases, the organization’s goal is to develop a mobile app with low development costs by simply “bolting-on” a mobile app to the existing legacy app’s services and data with no changes to the legacy app. In cases where the legacy application does not support the mobile app’s use-cases, then only limited extension of the legacy app is allowed. The last thing management wants is to retest and recertify a legacy enterprise application modified to support the roll out of a small set of mobilized features with an unproven ROI. I will take these same constraints into account as I build Mobile PetStore.
A design process I like to take is to create a preliminary design assuming I have no legacy system constraints. Then, systematically revise the design by rolling in constraints, beginning with those having the largest impact.
REST Web Service API Definition and UI Design
It is not uncommon to have limited useful technical documentation when working with a legacy system. Many times, the docs were not updated to reflect the state of the system as it evolved from release to release. In this case, I have almost no documentation on JEE6 Pet Store other than the source code. Rather than rummaging through the code, I decided to deploy it, run the app and learn about it from the outside inward. I will share access to the Petstore project in the next article.
In the following screenshot, I have imported the JEE6 Pet Store project into MyEclipse, deployed it to my local Glassfish server, and used the MyEclipse REST Web Services Explorer to view the app’s API and interactively test it. The REST Web Services Explorer enables you to interactively view and invoke the web service API of any JAX-RS web service. This made it a super simple process to develop familiarity with the web service API.[caption id="attachment_5523" align="aligncenter" width="488" caption="MyEclipse REST Web Service Explorer running JEE6 Pet Store"][/caption]
My REST Web Service Explorer experiments led to this very simple preliminary conceptual model for the mobile app.[caption id="attachment_5521" align="aligncenter" width="450" caption="Mobile Pet Store Model"][/caption]
User Interface Design
The data hierarchy is the simple tree, Catalog>Categories>Products>Items. A mobile user interface design pattern for interacting with this type of structure is a linked set of screens, one screen for each datatype. I used Genuitec’s MobiOne product to do a quick layout of the screens in iPhone and iPad formats.[caption id="attachment_5520" align="aligncenter" width="450" caption="Mobile PetStore – iPhone UI Mockup"][/caption]
In Part-3, I will dive in and do some programming. I’ll take a look at using jQuery Mobile for a useful UI layout.Did you miss Part-1? Click here to view the launch of the Mobile PetStore series.
Photo Credits: Bird image on the spash screen: http://animalphotos.info/a/2008/07/11/several-yellow-parakeets-some-facing-towards-camera-and-some-away/#more-3794
Drawing tools image: www.templay.de
There are zillions (literally) of Java enterprise applications that are candidates for being repurposed to provide benefit to mobile users. This is first of a multi-part series where we walk through the process of creating a mobile app for one of the most popular Java enterprise (JEE) applications, the Petstore application. We have dubbed the mobile application Mobile-Petstore, and it will provide browsing of the petstore’s catalog of exotic and classic animals. We will build Mobile-Petstore as an HTML5 application for iOS and Android devices. Following is the Petstore web user-interface (top) and a mobile user-interface mockup running on an iPhone5 and a Nexus S Android phone (bottom).
About the Petstore JEE Application
The Petstore application was developed by Sun (now Oracle) and first appeared in 2000 as a demonstration of key Java enterprise technologies and design patterns. (Many of us old enough to remember it will recall those painful days of suffering with EJB1.) It was updated around 2007 to use the latest JavaEE 5 technologies of that time. If you Google for the app, you will find it is no longer supported by Oracle. For this article we are using a new implementation of Petstore named Yet Another Petstore (YAP) from Antonio Gonclaves.HTML5 Applications - What’s the big deal?
Our plan is to build Mobile-Petstore as an HTML5 application for iOS and Android devices. If you are unfamiliar with HTML5 applications (a.k.a., hybrid apps), they are HTML5 webapps packaged as native apps. When the app is launched on a device such as an iPhone, the app starts up an integrated browser that loads the app’s HTML5 web user interface as if it were native. This simple approach has the benefit of being cross-platform capable (write-once, deploy anywhere) and very affordable to develop because it requires only basic web programming skills.
We will be using the latest version of MyEclipse IDE (MyEclipse ver. 2013) for development. MyEclipse 2013 includes cross-platform mobile and HTML5 development tools, which work great with JEE 6 apps like the Petstore. Specifically, we will make heavy use of MyEclipse App Center Builder, a cloud-based service for building native iOS and Android apps.
The user interface will be implemented using the JQuery Mobile HTML5 user interface library and the Knockout.js model-view library (more about this later). Mobile-PetStore will interact with the REST web service implemented by JEE6 PetStore application. The PetStore JEE 6 application is deployed to the Glassfish 3 server using the Apache Derby database for storage. We will say more about the PetStore implementation in a future article.
In Part-2 we will talk about the user experience and outline the REST web service APIs we plan to use.
With the power of HTML5, you can now add audio, video, and API elements to your projects to create complex web applications for mobile devices (Android, iOs) and across Linux, Mac and PC desktops. You can even use our HTML5 Visual Designer to design incredible UIs.
MyEclipse 2013 also seeks to make your development a more seamless and less painful process by providing slick new migration and deployment wizards. The Deployment of applications is now transparently handled through the Deployment Assembly Wizard which tells you clearly which modules are out-of-sync and precisely indicates the deployment stages of your projects.
For our MyEclipse Blue users, the MyEclipse 2013 provides better-than-ever before Migration support for RAD projects. The new Migration Wizard allows you to check the status of your projects and utilize our one step process to make RAD projects compatible with your current version of MyEclipse.Other improvements include the addition of Web Fragments support from project creation to deployment, expanded Eclipse library support, the inclusion of WindowBuilder Swing and SWT designers providing a more modern and robust designing environment, embedded Tomcat 7 server, TomEE server, updated embedded Derby server (now 10.9), and the latest 1.6 JDK - 1.6 update 43. You can download MyEclipse 2013 for Standard, Professional, and Blue editions on our Download Page and gain access to a free 30-day trial. Support for Spring and Bling versions of MyEclipse 2013 will be available in a couple of weeks. We look forward to hearing your feedback on this momentous release of MyEclipse.
EclipseCon kicks off today and we're ecstatic to be apart of this conference once again! Today, we'll be unveiling the new look and capabilities of MyEclipse 2013 which is scheduled for release next week, April 1st! Beginning April 1st, you can download MyEclipse 2013 here. MyEclipse 2013 will delight Eclipse developers around the world with its sleek new design and ability to mobilize projects and teams. With MyEclipse 2013, customers will now able to build and deploy mobile apps for popular devices while turning legacy applications into mobile using the powerful, new feature-set.
“I'm excited about MyEclipse 2013 as we introduce HTML5 development tools for mobile and web client apps. HTML5 is a central technology of the future for the enterprise.,” said Wayne Parrott, vice president of new products at Genuitec. “And our tools are built on the Eclipse platform so they are available to literally 10's of millions of developers around the world.”We can't wait to experience all that EclipseCon has to offer this year and hear how you are using the latest Eclipse technologies in your development! If you're attending EclipseCon, stop by booth 12 to chat with Genuitec'ers Jason, Jed and Amy and learn how we're changing your development experience and taking your projects into the Future, Now! [caption id="attachment_5159" align="aligncenter" width="300" caption="Looking forward to Good Times in Boston!"][/caption]
With so many tools available and so much confusion as to which of these technologies and frameworks will stand the test of time, it’s extremely difficult for end-users to decipher which tools to use today to ensure their apps have a place in future markets. Even here at Genuitec, we struggled to determine which of these technologies to hedge our bets on to allow us to go beyond the general scope of Java. This thought process, and listening to our customers, is the genesis of why we created MyEclipse 2013 with Mobile Tools (coming soon).
Eventually, and through much testing the breaking limits of HTML5, Genuitec made the decision to adopt this language, as we believe it has the greatest benefit to the future of the web and mobile, even though, to this day many developers doubt the promise of this technology. HTML5, we believe, will be a standard in the years to come for rich web and mobile development as the newest standard to the HTML language. As a completely virtual company we now require it for our own internal use, as well as for the tools and frameworks we develop - all which are supported by cloud-based services and web-based standards.
HTML5 will provide our MyEclipse 2013 users with incredible opportunities and great benefits. Not only does it ensure stellar web and mobile performance, but also provides a centralized technology and helps avoid security concerns. In addition to being revolutionary for the mobile world, HTML5 has also lent a great advantage towards the creation of desktop applications and operating systems - giving developers the ability to add rich functionality to previously static experiences. Many familiar names are now migrating-to and integrating HTML5 and CSS3 standards into their applications - Google has recently shifted their application focus to include HTML5, Adobe’s latest tools sets incorporate them, as well as Mozilla’s fancy new Firefox OS.
I believe this is just the beginning and we’ll begin to see more and more companies/applications making this shift over the next several months. Already, the W3C organization has announced it will accelerate the inclusion of this standard and browsers have started to add support for hardware-accelerated navigation and voice communication. With this in mind, developers should feel compelled to adopt these new web standards as doing so will help accelerate the growth of this technology and further the idea behind the currently much-used slogan “Deploy Everywhere.”
MyEclipse 2013 with Mobile Tools is coming soon (a week away). When you get hold of it - go out and test these new standards - push MyEclipse 2013 to its breaking limit and be surprised when it keep delivering, especially on your old legacy applications that you can make current.What’s more? MyEclipse 2013 with Mobile Tools has the Cordova/Phonegap framework and JQuery to take your apps “Mobile First.” Both of these technologies highlight what we call “Future Now” technologies, and are only a click away in our new IDE. So we’ll give you a week, until we release MyEclipse 2013 with Mobile Tools, but then it’s time to end your procrastination, wrap your arms around HTML5 and hit the ground running with a Mobile First attitude. - Alberto Osorio =============================================================== About the Blogger: Alberto is a Digital Infrastructure Associate for Genuitec. When he's not creating amazing databases and designs for our teams, he can be found serenading all of Mexico with his masterful guitar playing. ------------------------------------- (Original version in Spanish) ¿Miedo a HTML5? MyEclipse 2013 convierte tus aflicciones en impresiones!
With the number of smart devices growing by the day and the amount of time people are connected to their devices growing exponentially, we've reached a time in the corporate life-cycle wherein if you're not offering your customers a mobile solution, then you're one step closer to extinction. As such, IT Teams around the world are scrambling to develop and manage mobile technology, on-the-go sites, and apps. But where do you start? How do you prepare your programmers to adjust all they know and what they do to position your company in a mobile world? Do you learn new programming languages or outsource? It's a daunting but inescapable task. A task where you just wish there was an "Easy button" you could reach across your desk to push and BAM! the problem is solved. Now that you have a headache just thinking about, what if I told you that Genuitec has your Easy button? That there is NO need to outsource or learn new code, that finding your starting point was as easy as a download? Next month when Genuitec releases MyEclipse 2013, we will allow your Java EE and web developers to utilize the skill sets they already have and turn those skills into HTML5 and Cross-Platform hybrid apps (iOS, Android). From legacy applications to new creations, MyEclipse 2013 will provide beginning-to-end mobile technology without the hassle of learning new code. We think your developers are already great, now they can be stupendous with Mobile First support.
With all the customization options available in Mobile Development programs, it's very easy to get caught up in the over-abundance of options, especially where design is concerned. Our brains have been trained to pile on the toppings whether we like them or not. This "more the merrier" mentality can turn your well-thought out app into a mass of clutter faster than you can state the numerical definition of Pi (that's 3.14159265358979323846 for my non-mathematical friends). Cluttered apps are not only hard on the eyes, but they're also incredibly challenging to navigate through. It irritates your users, and completely diminishes your app's ability to convey a message to the world. Any chance at ROI is immediately vanquished. The challenge to create an impactful, navigable, eye-catching app while making sure all your bases are covered remains a slippery slope. Drawing the line between too much and too little, too plain and too busy has become an art form. Lara Strain, a tech writer for Genuitec, with the assistance of our Mobile Development team has put together a great list of Design Styling Tips to ensure your app doesn’t get off track, which I will highlight for you below. This list highlights the best practices we've seen in designing mobile applications. You can view the full document directly on our site, https://www.genuitec.com/mobile/docs/designStyling/designStyling.html. Tips for Designing without Deteriorating your App 1) Simplicity makes for easy navigation and clear messaging 2) Colors & Gradients add personality but should always be used in moderation to prevent visual overload 3) Using custom artwork and images provides flair and easy branding opportunity 4) Choose a simple text and stay consistent throughout the design 5) Strengthen branding with unique and sexy splash screens or StartUp images We hope these tips will shed some light on your design dilemmas and look forward to hearing your thoughts on mobile application design.
Anyone can create native and hybrid iOS and Android apps with MobiOne - anyone. Here's details on a minor update as we march toward MobiOne version 2.3 in early 2013. MobiOne Studio 2.3 Milestone-1 (2.3M1) provides users early adopters access to key new features that will be available in the upcoming 2.3 version. Please note that MobiOne 2.3 is a work in progress and the production version of its features and file formats may appear very differently. Download free trial / Learn more Important Notes
- Designer .mobi file format has changed and is NOT backward compatible to MobiOne 2.2.X and earlier versions. We strongly recommend that you always backup your .mobi files before upgrading them for using with any MobiOne milestone version.
- This early access release discontinues operation on Jan 1, 2013. Thereafter you will need to install a newer version of MobiOne.
- Design Center
- Send email from your application using
- new OnClick style Send Email action
- new Form (Send Email) action
- Updated HTML widget with background style properties: solid color, gradient, gloss, image
- Image "Keep Aspect Ratio" property is active when dynamically updating an image's src
- TextArea widget impromements
- new maximum length and read-only properties, improved scrolling for long content on iOS
- Code Generation Improvements
- New processing achitecture, code generation is now performed in a subprocess to optimize memory use
- Deprecated widgets: Button bar segment buttons (Left button, Middle button, Right button); this group will be replaced with a new ButtonBar widget
- Send email from your application using
- App Center
- Upgraded HTML5 app runtime framework to Cordova/PhoneGap 2.1
- Added splash screen/startup images for Android app
- April 2014
- March 2014
- February 2014
- January 2014
- December 2013
- November 2013
- October 2013
- September 2013
- August 2013
- July 2013
- June 2013
- May 2013
- April 2013
- March 2013
- February 2013
- January 2013
- December 2012
- November 2012
- October 2012
- September 2012
- August 2012
- July 2012
- June 2012
- May 2012
- April 2012
- March 2012
- February 2012
- January 2012
- December 2011
- November 2011
- October 2011
- September 2011
- August 2011
- July 2011
- June 2011
- May 2011
- April 2011
- March 2011
- February 2011
- January 2011
- December 2010
- November 2010
- October 2010
- September 2010
- August 2010
- July 2010
- June 2010
- May 2010
- April 2010
- March 2010
- February 2010
- January 2010
- December 2009
- November 2009
- October 2009
- September 2009
- August 2009
- July 2009
- June 2009
- May 2009
- April 2009
- March 2009
- February 2009
- January 2009
- November 2008
- September 2008
- August 2008
- Bright Ideas(38)
- Genuitec Promotions(10)
- Genuitec Staff(4)
- JRebel for MyEclipse(6)
- MyEclipse Bling(64)
- MyEclipse Blue(132)
- MyEclipse for Spring(104)
- MyEclipse G(18)
- SDC Cloud(16)
- Secure Delivery Center(128)
- Thought Leadership(30)