Skip to Content

Decisions, decisions…

If you’re starting out in SAP Enterprise UI5/Gateway development, you are going to find there are more than a thousand different ways of achieving the outcome. There’s editors, there’s repositories, there’s web content hosting, different types of views, binding techniques, etc; but in just a very quick post, I thought I would highlight just a couple of techniques that I think work well, and this is coming from one of the few Web UI developers still working on a Windows laptop in this space it seems – who would have thought 😐 (For reference, I also note IE is the most buggy browser for UI5 releases now days which is a shift for SAP)

Web Server

If you are developing UI5, and not sitting next to a big HANA data centre hosting the SDK; or are regularly on planes without WiFi (like we do in Australia), you’ll want to deploy Apache Tomcat or similar on your workstation.  You can deploy OpenUI5 libraries against an IIS instance but you don’t get everything working if you do this, so I suggest a local install of Tomcat, and hosting your UI5 there. But I actually don’t recommend Tomcat for testing your initial development. Why? Well speed of hitting f5 to refresh your app and test actually.

See for me, unless you are a JavaScript legend who has a JS interpreter in their head running continuously over your code understanding all the intricacies of the libraries you’ve included; making lots of changes in JavaScript within UI5 before doing a test leads to – “it’s broken, now what the hell did I do?”. Trust me, “Check for ‘file not found’ or parse errors.” will be the most annoying error message you come across when doing UI5 development.  And that’s when you need to go over every last change you did in the last 15 minutes to see where you broke the code. Performing more agile techniques of developing a small piece of functionality, then testing it; leads to a more sane development experience; and the ability to wrap up for the day on a win rather than not even wanting to check it in to GitHub as a stable version/backup (since I’m told you shouldn’t check-in to Github unless it’s a tested working change).

So the fastest way of testing I’ve come across on Windows, is just to point a virtual directory on IIS at my GitHub cloned repository, make change – test.  IIS instantly feeds up the new content without any delays. There’s some cool features in the UI5 Grunt server implementation you’ll read about on SCN (quickly typing this post so haven’t looked it up sorry) but I found the automatic 1 or 2 second delay in refresh was enough to annoy me, but this may work better for many.

One aspect to consider is setting up cache control appropriately for your source code and libraries. e.g. You want to make sure your ui5 libraries are cached in your browser, but also want to make sure that your code is not cached. You can turn off caching in developer tools, but that slows you down a lot also.

Testing against Gateway using Localhost

I’d love to be able to tell you to leverage the new mock framework in UI5 rather than be dependent on the Gateway server, but until someone posts a guide on how to do this for a production like Gateway service model that may not exist in development yet and responds with a level of logic – I’m forced to tell you how I leverage Gateway. So…

Quick and easy way to run UI5 on localhost and call Gateway (without CORS issues due to localhost and your Gateway hostname being different and Gateway not configured to say it’s fine to consume its services on localhost) is to run Chrome in unsafe mode (find your Chrome.exe file and add –disable-web-security ensuring Chrome is not running anywhere) – But that’s kind of annoying since I use Chrome for email and everything else and don’t trust the web to run in unsafe mode; so rather than do that, let’s create a reverse proxy so that everything from /localhost/sap/* goes to our Gateway server for processing. 

This can be a little confusing, but if you follow this post about it, it’s not too hard:

http://www.iis.net/learn/extensions/url-rewrite-module/reverse-proxy-with-url-rewrite-v2-and-application-request-routing

Try to not overthink it like I did, checking boxes I shouldn’t have, and it should be straight forward. You may need to play around with header variables and the like if someone has tuned your Gateway and you are using full paths contained with the Gateway responses (in other words, you may need to rewrite the contents of your Gateway calls to point at “localhost/sap” but for typical UI5 deployments, simply getting localhost/sap pointing at Gateway should do the trick.

e.g. If you modify your web.config file in c:\inetpub\wwwroot with the following; after install ARR and activating the proxy; you should be up and running:


<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
                 <rules>
                                <rule name="Reverse Proxy to Gateway" stopProcessing="true">
                                                <match url="^sap/(.*)" />
                                                <action type="Rewrite" url="http://<GatewayServer>:<Port>/sap/{R:1}" />
                                </rule>
                </rules>
        </rewrite>
    </system.webServer>
</configuration>


Editor

Sublime seems to be the editor of choice for UI5 (at least on Windows since Atom runs atrociously slow on Windows but may catch up soon) and hopefully you’ll find the information from John Patterson and Tobias Hoffman already to get you set-up correctly. I kind of wondered why everyone loved it since it was a great text editor (fast, easy on the eyes, lots of cool editor options like “find all” followed by editing all found locations at once simply by typing, but not a great development tool; but after looking into JS Linters that run while you type on Sublime Text 3, and Prettify to make all my XML, HTML and JS look fantastic (Thanks John and Tobias for highlighting this); I absolutely can recommend Sublime Text 3. Hopefully some of us are paying licenses for this as the developer(s) deserve making a lot from this editor (it’s kind of free but with an annoying prompt if you don’t buy it).  Note – Anyone come across a good real-time XML linter for ST3?

If you’re wondering what Linter is all about – well just wikipedia it, but in short it’s effectively looking for compilation or proper usage errors in your code.

Eclipse – Meh…

The HANA RDE for UI5 has hope, especially offering XML View intellisense, but was just too slow for me in Australia to be usable.

GitHub – Code Repository

I run GitHub Windows on my desktop as I’m not a power “Command line Git user” just yet and haven’t figured out what Sublime is capable of doing here, but it’s very cool for submitting the changes, and seeing the differences in your code.  To get a private repository for enterprise development is only US$7 a month; but if you don’t feel like paying that for privacy, make sure you accidentally let us in on your GitHub account so we can all learn from each other…

Now something I probably do incorrectly, but whatever, is I tend to backup versions of my code regularly while refactoring my code. The reasoning behind this is that GitHub makes it so easy to look at what you changed, and can help debug refactoring regression issues.  Plus, if I had a developer who only checked in once a week, I’d be worried they weren’t backing up their code anywhere. Supposedly working off branches is discouraged now days, but for me, the team is working on independent developments, so it isn’t an issue for now.


Deployment

John and Tobias start to get into this in Tobias’s Grunt blog and looks like John has a good #saptd session coming up about this that I plan to attend; but all I can say is; when it comes to deploying in production; standard development code can be significantly improved for performance.  Maybe on your initial release, deploy as is to allow debugging of problems; but effort (not insignificant) is required to get everything caching, minimalised, grouped, etc.


That’s all folks!

That’s it for now as I’m just quickly getting my thoughts down plus wondering how much more I don’t know that some of the readers may be able to help us with. For those new to UI5 development, I hope this is of help and gives you ideas, especially if you’re stuck (happily) on Windows.

To report this post you need to login first.

34 Comments

You must be Logged on to comment or reply to a post.

  1. Robin van het Hof

    Great blog, and as an OS X user, I’m quite envious on how easy it is to setup a reverse proxy on ISS Windows…

    As an OS X user, I don’t have IIS, but to test as localhost against my cloned Git repository, I open a prompt to the directory of my repository and type :

        python -m SimpleHTTPServer 8000

    (or use a different port if that’s already taken) This will instantly create a webserver, serving files from the current directory. This will also work for Linux users.

    I also start a new SimpleHTTPServer on a different port so I can serve the UI5 libraries.

    Of course, this approach doesn’t include the reverse-proxy solution to Gateway, but at least you can test as localhost 😉

    (0) 
    1. Matt Harding Post author

      Thanks Robin.  On a similar front, using mock services or non-GW apps, I find using public folders on Drop Box for ui5, is useful when you want to test on your tablet or phone (or just send to someone to test). Really quick turn around without any required external facing infrastructure.  Tomcat is a pretty good reverse proxy for your scenario, provided you can get past the initial regular expressions you may face setting it up (pretty sure it’s documented well though).

      Cheers,

      Matt

      (0) 
  2. John Patterson

    Hi Matt

    Thanks for the mention.

    I have a new Windows laptop for work and i decided to use Atom instead of Sublime Text, unfortunately i have to agree with you, as much as i want to like Atom being built on Webkit and Nodejs, it is currently very slow on Windows, only a matter of time till i install Sublime Text.

    For many reasons i think the default Eclipse Tomcat tooling is an anti pattern for SAPUI5 development. In the back of my mind i remember the early versions of SAP Portal, JSP HTMLB with Eclipse Tomcat Maven Ant configuration. It didn’t end well, for many customers the NWDI and even Java are still a dirty word.

    I use Nodejs for my web servers, the library is statically served on one server with caching and compression, the apps are served separately via a Grunt or Gulp file without caching (using watch and reload techniques). You can easily set up proxies in Nodejs and route multiple servers to one port. The real advantage of using Nodejs is it is very simple to understand being written in JavaScript and allows you to automate building, unit and E2E testing, deploying etc along side your content, one technology for most tasks. Because its light weight it easily scales from 1:N developers. Also it is tried and tested with similar toolkits like Angularjs with their frameworks like Karma and Protractor etc.

    I guess the point i am getting at is horses for courses, JavaScript and Java are completely different beasts. SAPUI5 is maturing to a point where it does require something like an NWDI to manage how teams develop, build, deploy and manage their source, much like the early versions of Java HTMLB and Webdynpro out grow its development environment. My hope is we see a solution built on JavaScript using open technologies like GIT/SVN and Nodejs and not something proprietary built in JAVA/ABAP.

    Cheers

    JSP

    (0) 
    1. Matt Harding Post author

      Hi John,

      It would be cool if there was a “council” with reps from various places that could help SAP come up with a quasi-supported (at least documented) enterprise deployment recommendation to help the organisations without web development evangelists out there but for the most part, I see it’s up to the more knowledgable/practiced types like yourself out there to help guide the community. This blog is kind of like a what to start thinking about, but a long way off an enterprise model that an outsourcer could take on for support, including supporting consultants like us doing projects at the same time.

      In terms of NodeJS, and grunt, I just found the watch/update approach took just half a second too long for my liking, but was very close to being a very cool approach, especially when it just refreshed your page on the fly.  On that subject, another issue to think further about is test data, as when your app becomes more complex, testing it becomes harder and harder. e.g. I think test frameworks, will become more and more important. Simple Fiori apps, maybe not, but more complex apps with lots of states – well – that becomes a challenge.  One non-SAP guy said to me once, when I said how hard it was to set-up test data in SAP; that we should do it lots more times until it became easier as a principle for things that are hard…Good advice.

      Any thoughts on RDE?

      Cheers,

      Matt

      (0) 
      1. John Patterson

        Hi Matt,

        Thoughts on RDE?

        I really want to like it, not sure what problem it solves though and who the target users are.

        If i compare RDE to something like Sencha Architect it has a long way to go in terms of content and features, even if it was to catch up i am not sure what problem it solves, a visual / configurable app builder which gets you part of the way to a product faster, sounds like an 80/20 solution, anyone who has the knowledge and experience to take it to completion will probably not need it to start with.

        Happy to be proven wrong.

        Cheers

        JSP

        (0) 
          1. John Patterson

            Hi Matt

            Yep previously known as WATT,

            Given its built on Orion- Eclipse Platform for Cloud Based Development. .wouldn’t Eclipse also have exactly the same XML feature. I don’t use Eclipse.

            Currently the features seem limited to Assisted Development and where you can use it,

            SAP River RDE Developer Guide

            The comparison to Sencha Architect is a bit of stretch at the moment, it has similar templates to start your app with, currently positioned more of an IDE than WATT was originally. No doubt we will see more features added at Dcode “End-to-end application development life cycle support” “for distributed teams” and it would make sense for it to be offered with similar features on premise also.

            Cheers

            JSP

            A bit more context

            “the ‘Web Application Toolkit’ (working title), which is a cloud-based Web-IDE  …consolidates efforts within SAP for AppDesigner, AppBuilder and Gateway consumption tooling into a single toolkit.

            Re: WYSIWYG tools for UI5

            EDIT: using Sencha Architect as a comparison was a bad idea

            (0) 
  3. Tobias Hofmann

    Meh? If you use Eclipse as a text editor, yes. If you use Eclipse as an IDE, that Meh sounds more like you are not using it right. Or how was that: copying XML file from ST3 to Eclipse to see what is broken?

    An IDE is there to increase productivity (run tests, collaboration, etc), but in the end you should be able to run everything you need from CMD (git push) and the rest needs to be done by our CI environment. If this is not the case, chances are good you are doing it wrong.

    (0) 
    1. Matt Harding Post author

      Hi Tobias,

      Well I’m sure I’m not using it optimally, but as my perception is my reality, let me explain my perception to you…

      It seems IDE’s like Eclipse or Visual Studio, still like to treat client side web apps ad server side apps and add lots of deployable objects around your resources which is annoying to navigate (it’s the small things). Then there is the required use of mouse all the time and non-consistent way of making switching tabs work (e.g. When you’re focus is not in the tab). There’s the speed of Eclipse which is just a little too slow. Let’s talk about taking an existing project and importing it – it’s just not intuitive. e.g. I make a SAPUI5 project (empty one) then import from file system, and it sort of works (The reason I noticed the XML problem was because of this approach of trying to bring my project into Eclipse when I tried to use Eclipse again, but the import did not work as expected, with intellisense not working so this is not as obvious as it should be). The files are not easily located where I want to host them (i like to keep my files in my Windows GitHub folder rather than distribute there everywhere). The test web site button would be cool if it was easy to put a shortcut key against it, and to simply open it up in my browser, rather than requiring a slow integration with Tomcat

      Now if there was a guide and video examples of how to integrate your project from GitHub into Eclipse (and back); plus how to optimally set this up with Grunt/NodeJS; and how to make keyboard shortcuts hum and not need the mouse, plus get the repository view just looking at the Web contents folder; and how to tune Eclipse to run optimally; then I’d be all over that, giving it a shot. Do you want to accept the challenge?

      So, I’m sure I’m definitely not using the IDE right, but I’ve been through the process several times of creating a UI5 app in Eclipse (even without importing anything); and the benefits of intellisense and being an IDE just don’t seem to outweigh the efficiency of Sublime at this point of knowledge.

      Cheers,

      Matt

      (0) 
      1. Robin van het Hof

        Actually, the only time I use Sublime is when I need to test something quickly and locally in a single file (kinda like JSBin testing online).

        For anything a bit more sophisticated (i.e. using separate view/controller files) I already abandon Sublime and use a ‘proper’ IDE (either Eclipse or Webstorm), the sole reason being it increases my productivity (the ‘I’ part of IDE)

        (0) 
      2. Tobias Hofmann

        The Ultimate Place to Show Your Anger

        https://www.eclipsecon.org/na2014/session/making-eclipse-ide-fun-again-continued

        Eclipse demands that you invest some time to make it work the way you want it. Having a clean workspace helps a lot, running Eclipse and tools from a RAM disk helps even more 🙂 Git projects are outside the workspace folder to keep them clean from Eclipse files, although I doubt that this really works.

        Sure, it would be nice to have Eclipse up and running in a customized way easily. If only it would as easy as ABAP Workbench that you can use without a training … oh wait, there is BC400 that teaches you how to use the ABAP workbench. It only takes you to invest 5 days and some money. ABAP Workbench Meh anyone?

        Eclipse for sure is not the best IDE available, but Eclipse tries to get better with every release. Luna is released since a few weeks and is faster than Kepler or Indio or … but SAP forces you to stay with an old version.

        • GW Tools: Kepler
        • ABAP, HANA, BW: Kepler
        • UI Dev Toolkit: Kepler
        • HCP tools are available for Luna.

        https://tools.hana.ondemand.com/#

        A little bit strange as SAP is really engaged in Eclipse but their tools are not part of the Eclipse Luna release.

        The strength of Eclipse is that’s an IDE. I can see the status of my Jenkins build, SonarQube view shows me where to improve my coding, MyLyn shows open tickets from my agile software system, switching between frontend and server code is just switch perspective, etc.

        If now Eclipse would simply accept a change in pom.xml without forcing me to refresh my project …

        (0) 
          1. Tobias Hofmann

            🙂

            Btw, it _would_ be nice if the plugins won’t be Eclipse exclusive. NetBeans, IntelliJ, etc are also used by companies and devs. With the move from Google to IntelliJ it makes sense to support that IDE too. At least for mobile development.

            (0) 
    2. Matt Harding Post author

      Hi Tobias,

      Just to check, within a view controller, can you set up Eclipse to do intellisense for this.<ctrl-space> ?  e.g. I just updated by Eclipse UI5 plug-ins, and created a brand new project, went into the init method of the view controller and went this “dot” and there’s no tooling to let you know you can do getView(); etc. Full sap.m intellisense in javascript and XML views would win me over big time, but it just seems it only works with fully specified variables.

      Cheers,

      Matt

      (0) 
      1. Tobias Hofmann

        If I use the Javascript perspective and “normal” JS code, it works. With UI5 JS: no way to get it working in a sane way. I think it’s the UI5 Eclipse plugin that needs some more love from SAP. But that is related to SAP and their history of Eclipse plugins.

        Actually I am still surprised that SAP isn’t forcing us to use a NWDS for UI.

        (0) 
        1. Matt Harding Post author

          Hi Tobias,

          UI5 is definitely a new style for SAP but I worry they will try to mickey mouse a solution in the future with a new WYSIWYG editor that hides all the complexity and generates streams of code that moves us further away from understanding what we’re developing. That said, introducing something like extensive support for UI5 in Typescript and proper XSD’s for XML views would be awesome in the future if SAP is listening.

          And the description of how you use the IDE now makes sense. If you were just doing Gateway, ABAP and UI5 development; then the IDE is less integrated and more just happens to be the one tool but without the ability to separate the windows easily to alt-Tab between them (and segw runs terribly within Eclipse as you need to force a new window every time).

          Also, I will always need my F1 help in ABAP sill, and it just doesn’t work well in Eclipse so even ABAP in Eclipse is an occasional tool for me (I swap depending on what type of development I’m doing – Bulk changes are great in Eclipse; creation of class definitions, better in SAPGUI screens (or at least SAPGUI screens in Eclipse).

          Cheers,

          Matt

          (0) 
  4. Jason Moors

    Hi Matt,

    Thanks for sharing your approach, tools and starting a great discussion, it’s clear from the comments that people are using lots of different tools, which is driven by different preferences, previous experience. I personally find a combination of Sublime text, templates, snippets, custom plugins and grunt task runners provide the best setup for me.

    Eclipse probably gets a bad press, for me it’s not my editor of choice, mainly due to the speed, but also because the SAP standard plugins don’t create enough automation to force me to open and use on a regular basis.

    Atom looks promising for the long term with the Git integration and Javascript plugin language, however I still prefer the speed and famarilarity of Sublime at the moment.

    One area that you touched on that I feel requires more focus is around automated testing, continuous integration, one tool that I have been experimenting with recently is linemanjs (http://linemanjs.com/), which tries to standardise development, test and build cycles.

    Regards,
    Jason

    (0) 
    1. Matt Harding Post author

      Hi Jason,

      I strongly agree with your last paragraph. Working in UI5/Gateway is so much more error prone than ABAP development due to the lack of typing and lack of visualisation layer and constants (in GW) that testing, continous integration, etc; needs to be understood and productionised going forward if you want to be efficient. I watched the LineManJS video, and while the guy was a great speaker, I have to admit, I didn’t get how it could be effective with UI5 development, but happy to learn. My post is the beginner’s tool guide for Windows; but if you feel so inclined, would definitely read about the above and how it can be applied to teams in UI5 effectively.

      Cheers,

      Matt

      (0) 
  5. Graham Robinson

    Hi Matt,

    one of the other issues this blog has reminded me of is what sort of developer will be most comfortable in this world of ABAP, GW, oData, HTML, Javascript, SAPUI5, etc.?

    One of the “selling points” of GW is that you can have your SAP skilled developers build services that can be consumed by pretty much anything. So you can pick and choose which consumption toolset, and thereby which developer, you want to use.

    But in some recent discussion I found SAP shops who had tried to get “web developers” to build the UI while they had their ABAP’ers do the backend. They found this didn’t work for them. Essentially the problem was that the UI developers couldn’t communicate problems to the back end guys effectively. They “didn’t understand ERP”.

    So they have come to the position that they want developers that can work across the whole stack – good news for people like us. They don’t necessarily want gurus everywhere – more like T-shaped people. For example if the UI developers have a problem with the GW service they want them to be able to jump into the ABAP debugger to diagnose the issue and effectively communicate it to those responsible. Having to pay premium rates for these types of people was not seen as an impediment.

    Cheers

    Graham Robbo

    p.s. Off topic totally – check out the first sentence of this post. I have a punctuation question. Should it be “etc.?”, “etc?” or should I have just gone with “etcetera?”?

    p.p.s And that then raises my follow-up question. What about the use of ‘?’ in my p.s. sentence?

    😆

    (0) 
    1. Matt Harding Post author

      Hi Graham,

      Definitely a mixed message coming from SAP around developers and how inclusive SAP can be (especially if you take non-ERP HANA apps off the table), but to your point, I’m definitely glad when working with people like yourself with both Web, GW and ABAP expertise, that I don’t need to debug every Gateway/backend problem.  And similarly, when developing UI5 at the same time as GW development, it is much easier than just GW development since GW is really hard to test by itself and you find yourself only building what you need rather than what you think might be needed!

      And no idea about etc(/.), but Word tells me to do “etc.” so that’s what I do, even with an extra “?”

      Cheers,

      Matt

      (0) 
        1. Chris Paine

          In this case etc. is the abbreviation so “etc.?”. However, this is a typically techy discussion. It reminds me of a time at school when I found a sentence that managed to repeat the word “there” followed by their – something like “there, there was their” I thought it was cool. My English teacher not so. Why – it’s unnecessarily confusing, so if in doubt write “and other stuff?” and dumb it down. But I guess it depends on the audience eh?

          (0) 
    2. Thomas Grassl

      Hi Graham,

      thanks for the ping on the developer type topic.

      There are many shapes or better said skill sets of developers out there and yes some of the programs we have in place is looking into expanding the community and bringing in additional skill set. I’m not using new vs. old because I believe developers and their skills evolve. I for myself started out in Pascal and now (if I find some time) try out stuff in Javascript, Ruby or other languages, and there were many other languages and interests in between.

      The ultimate goal is to have “full stack” developers, so it’s more about supporting and building out the skills of developers to cover everything from UI, apps, data. Or creating a stack and skill which can be consumed from different developers. Every developer starts somewhere and also has preferences, I see a lot of developers who love UI or mobile dev and data is more a pain or vice versa, today I had a discussion with on on guy who was just throwing all these data calculation examples at me (and I had to pretend I’m still following)

      Tools can help to bridge and to get these different skills closer together but it also requires some skills to open up domain expertise to other developers. You can follow this right now in the API talks, in the beginning everyone was creating APIs and thought “because I’m creating a API it must be good for other developers”. Now the discussion has shifted to what is a good vs bad API. Joshua McKenty | LinkedIn has a great analogy were he compares writing an API for a duck (the bird), most developers would create a wing API, a leg API and a gizzard API, etc. which is useless for an external consumer who needs a fly API, sit API…

      Ultimately “the stack” needs to be more accessible to the different developer skills (and preferences) wherever they are in the stack.

      (0) 
  6. Chris Rae

    Hi Matt,

    I can’t help but have a laugh knowing that my project is the cause of some of this angst. From a continuation perspective I am really concerned that SAP is missing the mark on how an enterprise is supposed to maintain, troubleshoot and build upon the UI5 projects.

    From a custom ABAP code point of view, it is easy we all know how to do that. With UI5 there seems to be no “standard” way of how someone is going to handle the development. For us, I am confident that we will get around this, I am concerned though that UI5 will turn into a “Select Few” technology. That is; only a select few will know how to change, fix or understand it. SAP has a long way to go here.

    What may interest you though is that I firmly believe there is a requirement and market for a WYSIWYG editor, even if it does add unnecessary bulk to the code. Why? Because you need to start somewhere. We need to be able to start handing some of these tools over to the the Business Analysts (consultants) to start knocking up prototypes and get them in front of the users. Sure they are not going to be perfect, but as you have seen in the journey we are on. The to-be business process is in no way related to what we are building. So who is wrong? the developers for not developing the to-be or the business analysts for not being aware of how and why this technology works and how it will look. The reality is that the business loves the end result because I took that role on because the BA’s did not have the skills or vision to do it.

    You cannot underestimate the power of putting these toolsets in the hands of less technically brilliant people such as you lot. UI5 adoption is dependant on the non-technical people understanding it. After all it is those same business analysts that in most places get to choose how they are going to deliver the work package. they want fast, easy, low risk and under budget. For most BA’s I would suggest that at this point in time they would choose ABAP or ABAP Web Dynpro as less risky than UI5. This needs to change.

    Now that I have that off my chest, the interesting point is how do you fix it. How do we get the confidence in the platform and reduce the perceived risk from a Business Analyst perspective. This shouldn’t just be up to SAP, this should be up to the community to participate in and evolve. Suggestions?

    Chris.   

    (0) 
    1. Matt Harding Post author

      Hi Chris,

      Quick answer (since you’ve got me working to a deadline right now 🙂 ), is I see the PowerPoint mockup tool plus tools like Balsamiq or equivalent (Alouka) being the tools of BA’s to do design with. And totally agree they need to get trained up in the look and feel and just do this. Chicken and Egg problem there of course but developers will create both the chicken and the egg initially to get everyone going I believe (did I just call developers some type of god???)

      That said, UX and associated UI design is an art that does take practice and is not your typical BA skillset unfortunately. On a previous project, we had UX principles that we advertised, but we still had functional consultants/BA’s putting forward SAPGUI screens for mass usage because it was easiest for them!

      There are WYSIWYG tools on their way, but going live with generated code like that concerns me as it makes every problem come down to a consultant saying “that must be an SAP bug, raise an OSS/SMP message”.  Or you get a great tool like Visual Composer which almost provides enough functionality, but not enough to become mainstream.  That said, I WYSIWYG tool that creates working mockups, and starter XML Views to use for development would be awesome!

      Confidence in platform? Risk? Well I guess that’s the point of Fiori apps being delivered. Once people get a hold of the new UI paradigm that is also mobile friendly, the business will demand it, regardless of the confidence/risk (possibly).  Managing the risk and taking time to build/solidify the platform will be the task at hand.  You can either wait for the dust to settle and follow others, or lead the way and take advantage of the improved usability that good UX design and good UI technology which should give you overall process improvements, albeit that may hurt a little no the way???

      Back to work,
      Matt

      (0) 
      1. Chris Paine

        I’d like to share an image that Ed Herrmann once showed me:

        Getting_Proper_feedback_Ed_Herrmann.png

        The key point – the rougher the prototype the better the feedback. I’d be wary of any UI5 specific prototyping, whilst it might prepare business for the end look and feel, it’s the function that’s probably more important.

        btw – I’m sure I saw some WYSIWYG stuff in the RDE (why is that thing still called River?) Or I might have been dreaming – been know to do that.

        Cheers,

        Chris

        (0) 
        1. Chris Rae

          HI Chris,

          I agree with your diagram and have been using rough sketches and wireframes for a long time in my developments. Where the change is here is that the business users (including functional consultants) still think this has to look like a dynpro screen. What is worse, when the think that we can do this “html” thing and draw whatever they like with no regard to a framework.

          I think the powerpoint tools are a great step in the right direction. We have used these in the high res mockups once we have gone past the low res of wire framing stage. It then turns into look and feel of the application.

          When presenting to the stakeholders to get project kickoff and signoff is where I think this toolset (and/or education) would have the most benefit. To put the size of the change in perspective, our users were adamant that we were not actually recording the result in SAP “because it couldn’t be happening that fast”. They therefore view screens as being the same old SAPGUI screens and lose interest in what is possible now. We need to get these mockups into the hands of the business ASAP. These are the types of changes that you are dealing with when introducing UI5. Any toolset that I can get my hands on that gives our Business Analysts that ability to knock up a prototype to assist them in selling the dream is ok by me. What becomes important is that the toolset is referenced to the framework. So in your diagram above, that rules out things like photoshop and other graphic editing tools. Until I have a better alternative the powerpoint deck fits the bill.

          (0) 
          1. Chris Paine

            Hi Chris,

            in some of the “consumer grade” UI5 code I’ve been writing, I’ve found that there is no limit to what I can achieve with UI5 – however, perhaps not best from a maintenance viewpoint. Custom controls allow for whatever look and feel that you want, and still allow leveraging of the framework – but obviously a custom control is just that – custom! Then it is your responsibility to maintain.

            I wonder if it would be worth putting together a UI5 lib for balsamic? – Mockups To Go – All Projects | myBalsamiq

            (0) 
  7. Matt Harding Post author

    Okay all – Just in defense of Eclipse a little, in order to get a hold of the latest SAPUI5 libraries to use on my local IIS (because for some reason, there doesn’t seem to be any way you can download SAPUI5 SDK anymore without hacking .SCA files for servers from SMP that seem to corruped); I grabbed the various UI5 jar files and unzipped them all and found a bunch of template files and that includes template files for XML. And when I went into the xml view, I discovered when you type something like Button followed by Ctrl-Space it put the full siganture in….Now if only XSD checking could be set up from the XSD’s I also found in there….

    (0) 

Leave a Reply