02
Sat, Nov
2 New Articles

Are Web and Mobile Apps Becoming a Challenge? Try a Modern Wireframe Tool

Development Tools
Typography
  • Smaller Small Medium Big Bigger
  • Default Helvetica Segoe Georgia Times

Today's drag-and-drop prototyping applications could turn designing a modern interface into child's play.

 

Designing colorful, artistic, and user-friendly interfaces is not something that RPG programmers generally could claim on their resumes. With the advent of Web services and mobile applications, as well as the increasing acceptance of Rational Open Access RPG Edition to help facilitate output to mobile and tablet devices, designing attractive UIs is something programmers may soon be asked to do in the future with greater frequency. One solution for those of us who didn't minor in graphic design could be to use a wireframe tool.

 

Today's prototyping tools are so fast and easy to use (and they allow for team collaborations on mockups) that even an experienced designer could fall far behind the power curve were he to rely on yesterday's mockup tools, such as Visio or even Photoshop. While many IDEs today include application designers, the trend toward agile development and team collaboration is encouraging developers to share their ideas and obtain detailed user and management feedback before ever beginning to undertake any coding.

 

Several prototyping tools have been quietly being refined for the past two or three years and are developing enthusiastic followings. A user of one decided to take his favorite mockup tool a step further and create a companion plug-in that takes the mockup diagram and automatically generates working HTML or Flex code at the push of a button! (One wonders if the developer shouldn't have put his talents to work on the lesser challenge of curing cancer.)

 

Among the newer tools that we looked at for this article were ones that have received a fair amount of attention in the developer community, winning awards and generally impressing judges at various software tool competitions. Another simply has a very holistic approach to software development and has attracted a devoted and loyal following. The three tools are WireframeSketcher, Justinmind Prototyper, and Balsamiq Mockups. All three allow you to download and try the products for usually 30 days at no charge. If you wish to go ahead and buy the product, two are under $100 each for a single-user license, and the third charges $495.

 

At $99, WireframeSketcher is in the middle of the price stack and offers a perpetual license, including 12 months of support with updates as part the initial purchase. It's claim to fame is that not only is there a standalone version, but there is another that plugs into Eclipse. It's good for quick mockups or for large prototypes and, like one of its competitors, offers a mockup style that looks like it was hand-drawn by a real nerd, not an advertising department employee.

 

The rough, unfinished hand-drawn look can be instantly switched to a "clean-theme" view if you wish to dress things up for a more polished or demanding audience. Wireframe Sketcher has the expected library of controls, buttons, and check-boxes, as well as a sizable collection of vector images, yet it still gives you the ability to create your own widgets through a simple wiki-style formatting interface. It also encourages you to create reusable templates for uniformity and greater productivity. As with most of these tools, they are cross-platform with native user interfaces running on Windows, Mac OS X, and Linux.

 

Justinmind Prototyper 4.4 is perhaps the most polished and inspiring tool among the three, a conclusion to which you might arrive particularly if you are the type of person who likes to impress. According to the company, which wasn't shy about sharing the names of its customer list, it is in use by Wells Fargo, the World Bank, and Bloomberg, to drop a few names in a much longer list of large, well-known companies. At $495 for a single-user unlimited perpetual license, it is more than six times the cost of the least expensive of the three—Balsamiq Mockups. However, students can get a whopping 80 percent discount, which, at $99 then, puts Justinmind in the same ballpark as the others. Nonprofits and academic institutions are eligible for a 50 percent discount. Moving forward nevertheless, the creators of Justinmind have no reservations about calling it the "ultimate wireframe tool" for its ability to create a Web prototype in minutes through simple drag-and-drop image functionality, components, links, and even actions and conditions. Its advanced navigation features and ability to render a prototype that instantly simulates an actual Web application running in a browser could give your users the mistaken notion that the development job is already complete. Justinmind's ability to output HTML code and "run" online gives users not only an opportunity to comment about your app's features, but a chance to actually click through the different screens to experience its work flow usability. When you finally get what people like, Justinmind will generate a document listing all the documentation of your wireframe, including interactions, diagrams, and comments. Users report that it's a good way to improve the customer experience of their Web sites and is ideal for defining their new mobile apps.

 

My favorite, however, is Balsamiq Mockups, which, at $79 for a single user license, fits more easily into my budget. There is both a standalone version for download as well as an online SaaS subscription version. It too has the low-fi sketch wireframes to allow your audience to concentrate on the functions, not the diagrams. It even has a hand-drawn font to be convincing. It comes with 75 built-in UI components and 187 icons plus offers a lot of user-community generated components. It too offers click-through prototypes using links to enable usability testing, and it does this by outputting PDFs with embedded links. Apart from the contributed components, users have extended Balsamiq Mockups to work with a number of other programs. There are a number of tools that recognize its BMML file type, including other mockup products and iPad applications such as SketchyPad and iMockups. MockGen turns Web pages into BMML mockups in a single click if you fancy a design but choose not to create it from scratch. And Balsamiq can create mockups for Confluence, JIRA, FogBugz and XWiki.

 

The most intriguing tools, however, are the ones that will take your mockup and export them to HTML, CSS, and JavaScript code. Among the most promising of these is Napkee, developed by Napkee Labs of the Netherlands, headed by software engineer Enrico Berti. There is a video on the Napkee site showing how Napkee can convert a Balsamiq mockup to actual HTML or Flex code, which is truly impressive. Hats off to Enrico Berti on accomplishing that feat. Napkee also is an affordable tool at only $49.

 

So that's a wrap on today's state of low-cost wireframe tools and prototyping tools, as well as a welcome find in the form of a tool that can convert a Balsamiq mockup directly into a working application user interface with no manual HTML, CSS, or JavaScript coding. Your total investment for this combo? A heart-stopping $128!

 

Download and try them for free to see if they work for you. Then try them on your next Web interface or mobile application.

Chris Smith

Chris Smith was the Senior News Editor at MC Press Online from 2007 to 2012 and was responsible for the news content on the company's Web site. Chris has been writing about the IBM midrange industry since 1992 when he signed on with Duke Communications as West Coast Editor of News 3X/400. With a bachelor's from the University of California at Berkeley, where he majored in English and minored in Journalism, and a master's in Journalism from the University of Colorado, Boulder, Chris later studied computer programming and AS/400 operations at Long Beach City College. An award-winning writer with two Maggie Awards, four business books, and a collection of poetry to his credit, Chris began his newspaper career as a reporter in northern California, later worked as night city editor for the Rocky Mountain News in Denver, and went on to edit a national cable television trade magazine. He was Communications Manager for McDonnell Douglas Corp. in Long Beach, Calif., before it merged with Boeing, and oversaw implementation of the company's first IBM desktop publishing system there. An editor for MC Press Online since 2007, Chris has authored some 300 articles on a broad range of topics surrounding the IBM midrange platform that have appeared in the company's eight industry-leading newsletters. He can be reached at This email address is being protected from spambots. You need JavaScript enabled to view it..

BLOG COMMENTS POWERED BY DISQUS

LATEST COMMENTS

Support MC Press Online

$

Book Reviews

Resource Center

  • SB Profound WC 5536 Have you been wondering about Node.js? Our free Node.js Webinar Series takes you from total beginner to creating a fully-functional IBM i Node.js business application. You can find Part 1 here. In Part 2 of our free Node.js Webinar Series, Brian May teaches you the different tooling options available for writing code, debugging, and using Git for version control. Brian will briefly discuss the different tools available, and demonstrate his preferred setup for Node development on IBM i or any platform. Attend this webinar to learn:

  • SB Profound WP 5539More than ever, there is a demand for IT to deliver innovation. Your IBM i has been an essential part of your business operations for years. However, your organization may struggle to maintain the current system and implement new projects. The thousands of customers we've worked with and surveyed state that expectations regarding the digital footprint and vision of the company are not aligned with the current IT environment.

  • SB HelpSystems ROBOT Generic IBM announced the E1080 servers using the latest Power10 processor in September 2021. The most powerful processor from IBM to date, Power10 is designed to handle the demands of doing business in today’s high-tech atmosphere, including running cloud applications, supporting big data, and managing AI workloads. But what does Power10 mean for your data center? In this recorded webinar, IBMers Dan Sundt and Dylan Boday join IBM Power Champion Tom Huntington for a discussion on why Power10 technology is the right strategic investment if you run IBM i, AIX, or Linux. In this action-packed hour, Tom will share trends from the IBM i and AIX user communities while Dan and Dylan dive into the tech specs for key hardware, including:

  • Magic MarkTRY the one package that solves all your document design and printing challenges on all your platforms. Produce bar code labels, electronic forms, ad hoc reports, and RFID tags – without programming! MarkMagic is the only document design and print solution that combines report writing, WYSIWYG label and forms design, and conditional printing in one integrated product. Make sure your data survives when catastrophe hits. Request your trial now!  Request Now.

  • SB HelpSystems ROBOT GenericForms of ransomware has been around for over 30 years, and with more and more organizations suffering attacks each year, it continues to endure. What has made ransomware such a durable threat and what is the best way to combat it? In order to prevent ransomware, organizations must first understand how it works.

  • SB HelpSystems ROBOT GenericIT security is a top priority for businesses around the world, but most IBM i pros don’t know where to begin—and most cybersecurity experts don’t know IBM i. In this session, Robin Tatam explores the business impact of lax IBM i security, the top vulnerabilities putting IBM i at risk, and the steps you can take to protect your organization. If you’re looking to avoid unexpected downtime or corrupted data, you don’t want to miss this session.

  • SB HelpSystems ROBOT GenericCan you trust all of your users all of the time? A typical end user receives 16 malicious emails each month, but only 17 percent of these phishing campaigns are reported to IT. Once an attack is underway, most organizations won’t discover the breach until six months later. A staggering amount of damage can occur in that time. Despite these risks, 93 percent of organizations are leaving their IBM i systems vulnerable to cybercrime. In this on-demand webinar, IBM i security experts Robin Tatam and Sandi Moore will reveal:

  • FORTRA Disaster protection is vital to every business. Yet, it often consists of patched together procedures that are prone to error. From automatic backups to data encryption to media management, Robot automates the routine (yet often complex) tasks of iSeries backup and recovery, saving you time and money and making the process safer and more reliable. Automate your backups with the Robot Backup and Recovery Solution. Key features include:

  • FORTRAManaging messages on your IBM i can be more than a full-time job if you have to do it manually. Messages need a response and resources must be monitored—often over multiple systems and across platforms. How can you be sure you won’t miss important system events? Automate your message center with the Robot Message Management Solution. Key features include:

  • FORTRAThe thought of printing, distributing, and storing iSeries reports manually may reduce you to tears. Paper and labor costs associated with report generation can spiral out of control. Mountains of paper threaten to swamp your files. Robot automates report bursting, distribution, bundling, and archiving, and offers secure, selective online report viewing. Manage your reports with the Robot Report Management Solution. Key features include:

  • FORTRAFor over 30 years, Robot has been a leader in systems management for IBM i. With batch job creation and scheduling at its core, the Robot Job Scheduling Solution reduces the opportunity for human error and helps you maintain service levels, automating even the biggest, most complex runbooks. Manage your job schedule with the Robot Job Scheduling Solution. Key features include:

  • LANSA Business users want new applications now. Market and regulatory pressures require faster application updates and delivery into production. Your IBM i developers may be approaching retirement, and you see no sure way to fill their positions with experienced developers. In addition, you may be caught between maintaining your existing applications and the uncertainty of moving to something new.

  • LANSAWhen it comes to creating your business applications, there are hundreds of coding platforms and programming languages to choose from. These options range from very complex traditional programming languages to Low-Code platforms where sometimes no traditional coding experience is needed. Download our whitepaper, The Power of Writing Code in a Low-Code Solution, and:

  • LANSASupply Chain is becoming increasingly complex and unpredictable. From raw materials for manufacturing to food supply chains, the journey from source to production to delivery to consumers is marred with inefficiencies, manual processes, shortages, recalls, counterfeits, and scandals. In this webinar, we discuss how:

  • The MC Resource Centers bring you the widest selection of white papers, trial software, and on-demand webcasts for you to choose from. >> Review the list of White Papers, Trial Software or On-Demand Webcast at the MC Press Resource Center. >> Add the items to yru Cart and complet he checkout process and submit

  • Profound Logic Have you been wondering about Node.js? Our free Node.js Webinar Series takes you from total beginner to creating a fully-functional IBM i Node.js business application.

  • SB Profound WC 5536Join us for this hour-long webcast that will explore:

  • Fortra IT managers hoping to find new IBM i talent are discovering that the pool of experienced RPG programmers and operators or administrators with intimate knowledge of the operating system and the applications that run on it is small. This begs the question: How will you manage the platform that supports such a big part of your business? This guide offers strategies and software suggestions to help you plan IT staffing and resources and smooth the transition after your AS/400 talent retires. Read on to learn: