Category Archives for AppNews

Wireframe Android and iOS Apps with Excel!

October 27, 2013

iPhone  Why would anyone create mobile app interfaces in Excel?  … Well, that’s what I do … tell ya why.

I want my apps to be accepted, approved and downloaded.

User acceptance is often the hardest thing to get right. Wireframes or prototypes are a great way to get users to try an app before committing to a design and rendering that design in code (the act of converting the design into software code). A wireframe can alert a team to a problem early, when changes are easy. At the same time, stakeholders need to approve the app before it’s released. And if testers are excited with the wireframe, the final app will get downloaded, liked and tweetted. So wireframing is a way to get approval and acceptance before the coding starts.

But most wireframe tools are cumbersome. They require that everyone has the wireframe software installed. But not with Excel. Most people have that already. And Excel has all the graphic user interface tools already – checkboxes, pop-up menus, buttons and a way to display the app prototype. It’s all there, an already installed platform to test, try and talk about your developing app.

Look at this REAL app example (or watch the video here). Here we see my app wireframe in Excel. This is the iPhone home screen. But we have more than just a pretty picture. Press the app icon (right side, second icon down in the screen shot) and Excel causes the screen to change …

… like this …

iPhone2iPhone3

Tapping the app icon simulates launching the app. Excel changes the screen just like the real app would. Now the screen shows the app view. Yes, Excel enables user experience (UX) by way of buttons, menus, checkboxes and other iPhone native controls. In other words, Excel has the functions, features and controls to create the full UI/UX so that the app can be modeled before development.

This is called Model Driven Architecture (MDA) or Model Driven Design (MDD). Both of these are the idea of letting end users write a model of the software before you write the real application. Let’s see how that works.

Here we have a real app that I created. It is a little T-Shirt quoting app. The goal was to let T-Shirt printers be able to quote a T-Shirt print job from their phone.

The left screen shot shows you the app calculating the total price of the job and the per shirt cost. All basic math stuff that you’d expect Excel to be good at. But the right screen shots show you Excel’s controls for pop-up menus and check boxes. All the features that allow user to feel the user interaction and user experience of the app. At this early stage the app is taking shape and testers, stakeholders and end users can run the app and comment on the user interface, functionality and the user experience.

iPhoneExcel3   The real power of Excel for modeling are the TABs. Our T-Shirt app has the user interface on one tab, the equations and data on separate tabs. Thus, UI developers can focus on the interface tab. Business stake holders and subject matter experts can focus on the data and equations tab.

Here you see the data that the app uses to calculate the T-Shirt quotes. Because the data is on an Excel tab, it is not obscured in C or Java code. All members of the team can see that data and equations that are used. Even non-technical stake holders can see the transparency (no pun intended) in the wireframe.

When all team members can understand what is happening in a business app, the whole them has confidence that the app will reflect the business logic and business benefits. That confidence allows for a test standard the app can be tested against. Confidence, and a reliable test helps the app get corporate approval faster.

But that’s not all Excel can prototype.

Web, desktop and tablet apps that access the cloud can be prototyped in Excel with live data because of Excel’s ability to get real-time data from the web.

 

iPadExcel  Here I have a model of a stock quoting app. I have both the laptop and iPad version on screen to see the interface.

Because Excel can get data from the web, the model is updated in real time and I don’t need to write any code to test the app. That is, Excel provides methods to get data from a website. As long as the site feeds data to a webpage, I can get and update the HTML stream into my wireframe. No major coding needed.

This speeds prototyping and testing. Once the user interface is accepted, I can then code out the app in iOS or Java for Android. I know what the final design needs to look and work like. Model Driven Architecture and Model Driven Design allow a team to sign off on an application design. THEN the coder can code it out. This mean no surprises. The developers (like me) have a clear model to target. Testers have a benchmark to compare the final application to. And all stake holder know when the final application is ready for release.

MDA and MDD are one of the best ways to develop an application with many stakeholders.

Agile relies on incremental development, but these project can fail when you have too many stakeholders. This is because few can see how each step will lead to desired product. And SDLC or waterfall is slow because of all the up-front documentation needed. Models that are quick to develop, allow all stakeholders to agree on a vision and a design. And they can make that decision faster with simple modeling or wireframing tools.

And what could be simpler than Excel. Most stakeholders know how to use it now (no wirerame tool training needed). Excel has the interaction tools that make it better than Photoshop mock-ups. And Excel files can be emailed to remote team members. But best of all, models in Excel give developers a way to target final development that is well defined. If the team approves the model, developers just need to code-out the model in the new target language.

I developed my Excel Modeling Kit when working at Proquest, UnitedHealth and the Ford Motor Company in Dearborn Michigan.
If you’d like a copy of my kit, with training videos – it is available for download with a link at the bottom of this page.
If you want some help creating your next application in Excel, please contact me – [email protected].

P.S. I’ve even written software to convert Excel models to real webapps that can run on iPhone and Android mobile devices. That means that Excel can be used to actually DEVELOP the app from concept, to model, to final web app. Try that with any other wireframe tool!

Contact me for available training dates for live or onsite training.



Movie Sticky Notes

MovieStickyNotesMovie Sticky Notes allows you to tag notes to individual frames of the video, save the notes with the video file, and jump to the right frame in the video by clicking on the note.

Ever need to watch a video clips communicate your notes? Animators often needed to get dailies or raw footage to clients or collaborators for comments – but it was a hassle. This problem has gotten worse as more people are shooting video. Until now, there was no convenient way mark-up video for discussion.

Problem solved!

Now, there’s Movie Sticky Notes. It lets you watch a video, and add a note to just the right spot. And because Movie Sticky Note attaches the note to a specific frame, others know exactly where in the video you mean. You ideas are communicated with less effort.

And because the note is a simple text file, you don’t need to email the video back and forth – just email the updated note file. Now two way collaboration is fun! … or at least not the hassle it once way.

Watch this video to see how Movie Sticky Notes works.

Follow the link to LightBolt.com and download the trial version today!

*** This software is in Beta Testing. So you can download the current version and try it for free. Please email comments or bugs you find.

MovieStickyNotes Mac Intel Cocoa (10.5-10.8)
MovieStickyNotes Mac Carbon (10.5-10.6)
MovieStickyNotes Windows XP – 8

You’ll need a license to add notes, just email me during the beta period.
The beta versions will die after a while.

 

Apps We’re Developing

Currently we are finishing a Restaurant POS app with a Mac, Windows and Linus GUI. The differentiators of this app is that is networks will all platforms so that elegant Macs can be used in the front of the house, while less expensive Linux or Windows servers can be used in the kitchen and back office.

Our time-billing app is in beta testing. It allows users to track tasks – which sounds ho-hum. But this app lets users quick-tap to change tasks. The tasks keep an ongoing log of the time spent per task.

One of our new clients (in California) asked us to write a video app to capture public speakers. The client presents public speaking seminars for professionals. The app allows multiple takes and copies the student’s videos to their flash drive at the end of the class. The tricky part was making sure the app worked with a wide variety of cameras.

This seems to be the month of video projects. A video animation company in Israel asked us to fix their Java app that was abandoned by their last contractor. The application allows a team to comment on a video project by attaching  notes to specific video frames. This is a cross-platform app that is working great! A very fun project.

We also secured a client in Atlanta who programs BMW and other German performance vehicles. As you may know, most cars today, are dependent on a computer chip to control the vehicle. Fine tuning the software in these chips can yield better performance. Being in the Ann Arbor area (yet near Detroit) we know a lot about cars. However, the Germans are tight-lipped about the secrets of programming their vehicles. This client has asked us to write software to allow car enthusiasts to be able to re-program their own vehicle (with guidance from the client). As such, this software has a B2B and B2C component. The B2B component focuses some software features on BMW dealers that want to offer re-programming as a service.

One small app that I programmed for myself, was Hunks-Of-Text. I constantly find myself pasting he same code into a project or the same paragraph in to email. So Hunks-Of-Text allows me to save all these paragraphs to a file and paste them by just double clicking. The app stays on-screen but minimized. It will be for sale later this month (or likely free).

Until next month,

Eric

1 77 78 79