It is currently 21 April 2025, 23:09 Advanced search

Customizing the UI and Widgets

Questions and answers on how to best use Instant Developer

Re: Customizing the UI and Widgets

Postby johntalbott » 16 May 2014, 12:23

Thanks for the additional info Gaby.

Hello Luca,

Can you respond to the questions my original post? I'd really like to understand what can/can't be done.

Thank You!
johntalbott
 
Posts: 141
Joined: 16 March 2014, 21:33

Re: Customizing the UI and Widgets

Postby lucabaldini » 16 May 2014, 12:45

1. How might one change the UI to look more modern?

The short answer is: by changing CSS and Javascript (the later if needed)

2. Are there any tutorials for customizing the UI?

No, there are no tutorials because this is, normally, a problem a graph guy has and he, normally, knows how to customize a web page and he, normally, has his own tools.

3. Is it possible to have unbound widgets? Example ... I want a search box above a grid that is used to search fields in the grid.

You can put an entire form inside a static field... and you can open a form in a popover configuration so that it can float around... if you want you can move the list down and put other fields (or even a sub-form/sub-frame between the toolbar and the list).

4. If desired ... is it easily possible to use other widget libraries such as JQueryUI or Kendo UI?

Some of our customers have done that... they've included jQuery or other libraries' widget.

Now the only "problem" I see here is time. InDe produces an XML file that is send to a Javascript engine that takes care of creating ALL the UI... now, can you change that? Sure! You can change everything in the Javascript side... but you have to know it if you want to change it... For instance: how about change all the panel's toolbar position? How about moving all panel's toolbar on the right... it can be done... but you have to change some javascript functions that takes care of drawing forms and panels. Can you change colors and padding? Sure... you have to undestand how the view has been designed and created and which CSS class each object uses... that you can customize the UI using CSS.
Can you include a widget that does something useful? Sure, but you have to understand how that widget works and how it can be "connected" with our framework... if the widget have to communicate with your app you have to know where are the app entry points. This is a very short answer and it would take time to explore all of the implications but it can be done... some of our customers have studied our framework and they were able to change something... they don't know everything (and at every new version we keep adding stuff) but it can be done.

I hope this answers your original question, does it?
User avatar
lucabaldini
Pro Gamma
Pro Gamma
 
Posts: 4990
Joined: 1 October 2010, 17:03
Location: Bologna

Re: Customizing the UI and Widgets

Postby johntalbott » 28 May 2014, 18:18

Thank you Luca. Your response answers some of my questions. But I'm still looking for more. ;-)


lucabaldini wrote:
1. How might one change the UI to look more modern?
The short answer is: by changing CSS and Javascript (the later if needed)



2. Are there any tutorials for customizing the UI?
No, there are no tutorials because this is, normally, a problem a graph guy has and he, normally, knows how to customize a web page and he, normally, has his own tools.


In my experience the graphics guy (designer) just designs the look. It still take a programmer to implement those changes to the UI.

Assuming that one had a custom design to implement, it would be good to see a tutorial on how to do that.

Do all of your current customers really just use the out of the box look and feel?

3. Is it possible to have unbound widgets? Example ... I want a search box above a grid that is used to search fields in the grid.
You can put an entire form inside a static field... and you can open a form in a popover configuration so that it can float around... if you want you can move the list down and put other fields (or even a sub-form/sub-frame between the toolbar and the list).


I'll have to look into this.

4. If desired ... is it easily possible to use other widget libraries such as JQueryUI or Kendo UI?
Some of our customers have done that... they've included jQuery or other libraries' widget.


What made your customers decide to utilize 3rd party widget libraries?

Now the only "problem" I see here is time. InDe produces an XML file that is send to a Javascript engine that takes care of creating ALL the UI... now, can you change that? Sure! You can change everything in the Javascript side... but you have to know it if you want to change it... For instance: how about change all the panel's toolbar position? How about moving all panel's toolbar on the right... it can be done... but you have to change some javascript functions that takes care of drawing forms and panels. Can you change colors and padding? Sure... you have to undestand how the view has been designed and created and which CSS class each object uses... that you can customize the UI using CSS.
Can you include a widget that does something useful? Sure, but you have to understand how that widget works and how it can be "connected" with our framework... if the widget have to communicate with your app you have to know where are the app entry points. This is a very short answer and it would take time to explore all of the implications but it can be done... some of our customers have studied our framework and they were able to change something... they don't know everything (and at every new version we keep adding stuff) but it can be done.

I hope this answers your original question, does it?


I agree that 1. it will likely take more time and 2. one has to understand how to integrate 3rd party widgets with In.De.

If your clients are doing it on their own, does it make your wonder that there is a need to be met?

Options that come to mind for me ...

1. Could you expand your widget library to provide functionality on par with the popular libraries?
2. Could you allow "direct" support for 3rd party widgets?
3. Could you at least provide a tutorial on how it can be done? (like whatever your current customers have done.)

Bottom line ... it's hard to accept your response which I'll summarize as ... "Yes, it can be done. It will take a lot of time. And good luck figuring out how to do it." :-)

Overall from a pure delivering functionality quickly ... In.De is really great. At the same time .. clients expect great looking modern (web 2.x) UI's.
johntalbott
 
Posts: 141
Joined: 16 March 2014, 21:33

Re: Customizing the UI and Widgets

Postby lucabaldini » 29 May 2014, 9:54

If your clients are doing it on their own, does it make your wonder that there is a need to be met?

Once one of my client asked me how to incorporate an open-source free javascript library in its app... I've asked: "why do you need this? Maybe you can do what you are asking with a book... and his answer has been: I'd like to use that library"... In other words... you say "there is a need to be met" but what's that need? If something that is not in the framework is needed the best way to obtain it is to ask for that missing functionality.
Maybe it will not be implemented immediately and if you find somwthing on the web and you need it immediately the best way is to try to incorporate that library.

1. Could you expand your widget library to provide functionality on par with the popular libraries?

I don't understand this question. What do you mean with "par with the popular libraries"? Which libraries, and what do you mean with "par"?

2. Could you allow "direct" support for 3rd party widgets?

Do 3rd party widgets have a "common interface"? Is there in the web world a common interface that can be used to "merge" components? I've seen a loooot of javascript components but none of them have a common interface... the interface is always invented by the developer that immagines that in order to do something you have to call a function, create an object, send some events, create a DOM object, ... Unfortunately, afaik, there is not something "common".

3. Could you at least provide a tutorial on how it can be done? (like whatever your current customers have done.)

Even here I don't know how to answer. Let me make an example. You want to include an HTML editor because you don't like our HTML editor... you find a very nice HTML editor on the web and you'd like to include that. Now, probaby that beautiful HTML editor is made of 10 javascript file, some css, images and so on. So you know how to incorporate that with a custom directory... but now you have to "attach" that component to our app... and that's is not gonna be easy... you have to study their interface, learn how our interface works and than "merge" the two interfaces. When you click something inside that editor you have (meybe) to inform our framework... or, when you do something in the app you want that component to do something.

So, we have some "channels" that allows:
- an app to send "javascript" messages to anyone on the browser... and the function for that is the executeOnClient function ( http://doc.instantdeveloper.com/eng/def ... a&lang=eng )
- an app to receive something from everywhere, even from something that is inside the browser (a widget?)... for that you have to implement the OnCommand event and receive there all messages... if you want to send something to your app from the javascript world you have to call the javascript function RD3_SendCommand. That function has two parameters: the first is the COMMAND (that you will read on the server side inside the Command parameter of the OnCommand event) and another is a list of parameters (in the form PARAM1=VALUE1&PARAM2=VALUE2...) that, in the same OnCommand event, you can read using the GetUrlParameter library function ( http://doc.instantdeveloper.com/eng/def ... 3&lang=eng )
That's, normally, everything you need to know in order to "attach" a widget, a javascript library, anything. But is this sufficient? I don't know... it depends on the widget you want to include and "how deep" it have to be "attached". Normally (99% of the case I know) that is sufficient... but for widgets that have to work only on the client side (so that they have to send messages only on the client part) probably you need something more... and for that you have to know how our RD3 framework works.

Bottom line ... it's hard to accept your response which I'll summarize as ... "Yes, it can be done. It will take a lot of time. And good luck figuring out how to do it." :-)

My answer is still the same: yes, it can be done, it takes time (how much depends a lot from what you want to include... and how it works)... and the solution depends a lot from the "widget/3rd party component" interface... because there is not a common or world standard interface between widgets.

Overall from a pure delivering functionality quickly ... In.De is really great. At the same time .. clients expect great looking modern (web 2.x) UI's.

We keep working on the user interface and, normally, we release a new theme every 2-3 years... so, stay tuned. :-)
User avatar
lucabaldini
Pro Gamma
Pro Gamma
 
Posts: 4990
Joined: 1 October 2010, 17:03
Location: Bologna

Re: Customizing the UI and Widgets

Postby lucabaldini » 29 May 2014, 10:15

I keep thinking at your last sentence and I've a question for you... You say

clients expect great looking modern (web 2.x) UI's.


I'm curious to undestand this a little bit more... What you you mean with "modern web 2.x UI's"? I think our interfaces are modern web 2.x UI and you can customize them a lot just by configuring Visual Styles and changing icons and CSS colors.
But, maybe, I'm wrong. So I'd like to understand more about this.

Do you have an example of a modern web 2.x UI's that you can't do with InDe? I'd like to see it because I'm sure that you can get it without 3rd party components or widgets... The majority of my clients are not importing widgets because they don't need them. So I'd like to see an example of something that you'd like to obtain... I'm pretty sure that it can be done with InDe.
User avatar
lucabaldini
Pro Gamma
Pro Gamma
 
Posts: 4990
Joined: 1 October 2010, 17:03
Location: Bologna

Re: Customizing the UI and Widgets

Postby josevelez » 29 May 2014, 20:33

Luca,

Don't take this the wrong way but Inde does NOT have anything the resembles a modern 2.x UI. I am specifically referring to the "Desktop and business applications" you have listed on your site. I will elaborate:

1. The Portal - This theme is childish looking and really does not belong in a category that mentions business applications.
2. The WebTop - Again, childish looking and really? Why would I create an application that looks like a Windows 98 desktop?
3. The Northwind and Task Management apps more closely resemble a business application but again, why does it have to feel like I am operating inside Windows?

In no way would I consider those themes as modern 2.x. Perhaps there is functionality behind it that makes it technically modern 2.x but what the end user wants is a more polished and frankly better looking UI.

I could list several competing products/offerings to provide examples of much better looking UI's but that is not necessary. Bottom-line, as I've mentioned before, I've stayed away from Inde for two reasons and one of them being that the UI is just a no go from the beginning.

I know this comes off as harsh but business is business and I'm of the belief that any feedback from your potential market is always good feedback that can be used to improve a product or service. So I hope it is received as such - constructive criticism.

Best,

Jose
josevelez
 
Posts: 404
Joined: 7 June 2013, 17:25
Location: Dallas, Texas

Re: Customizing the UI and Widgets

Postby josevelez » 29 May 2014, 20:59

lucabaldini wrote:
Overall from a pure delivering functionality quickly ... In.De is really great. At the same time .. clients expect great looking modern (web 2.x) UI's.

We keep working on the user interface and, normally, we release a new theme every 2-3 years... so, stay tuned. :-)


Luca,

Perhaps 2-3 three years really is not a sufficient amount of time to review and update the UI. Things change often and quickly in the cloud space and UI is a BIG component. It really should be considered in every release cycle/update.

This is going to get me off on another related rant but I can't help to bring it up again - Inde, as well as most other competing solution providers, are still sleeping at the wheel with their existing business models. Right now, many folks are essentially settling for what is currently available and quietly and not-so-quietly grumbling about common short comings (limits to number of users, database size, limits to "classes", etc...). This is happening because no provider has yet to offer a product that has satisfied the total package requirements or desires of developers.

Now when a product does come around, and it is only a matter of time, I can expect that there will be a 'sucking sound' as developers start abandoning their current tools. I'm a long term thinker and perhaps this is 5-10 years away but the vision remains the same. The first provider to create an offering that just gives devs what they want and gets out of their way will be wildly popular. The economics of near-zero marginal cost will certainly make it possible to offer a solution to devs at a reasonable cost. The first to do so will have a tremendous advantage over their competitors.

Inde has a compelling product but with a some minor shortcomings:

1. UI - it NEEDS to be revamped and brought into the Web 2.x age. Leave Windows where it belongs - in the 90's.
2. Limits to classes - This is petty really. Just offer a tool and get out of the way. If I buy a hammer from the hardware store I would laugh at them if they told me I was limited to how many items I could use it on. It costs NOTHIING for me to use that hammer more or less to my heart's desire. The same is true of classes - it just makes no sense to expect me to pay more for something that seems to be just arbitrarily set.
3. Limited support - Any product is going to need a ROBUST amount of resources to ensure success- after all, if the dev is not successful, what is the likelihood he/she will continue to use the product or refer it to someone else? The Inde forums is lacking a large community, the documentation is prolific but not effective or efficient and there are no video tutorials (really a must have these days).

So again, I may sound harsh but it is intended as constructive criticism. Inde or one its competitors has the opportunity to step out of the box and consider a vision that is larger than just their product. I am just waiting patiently to pounce on the first to get there. I am watching several, inde included, and I try to nudge them with these comments when I can. Only one of them will be spared the "I told you so". Who? Time will tell.

My 2 cents.

Jose
josevelez
 
Posts: 404
Joined: 7 June 2013, 17:25
Location: Dallas, Texas

Re: Customizing the UI and Widgets

Postby lucabaldini » 30 May 2014, 7:23

Perhaps 2-3 three years really is not a sufficient amount of time to review and update the UI. Things change often and quickly in the cloud space and UI is a BIG component. It really should be considered in every release cycle/update.

We do update and upgrade our UI every version (i.e. every four month!) but every 2-3 year we build a complete new theme from scratch and I think this is good enough. And several clients have build their own theme and their theme is, sometimes, really different from the theme you get out of the box. They've changed almost everything not only colors.

1. UI - it NEEDS to be revamped and brought into the Web 2.x age. Leave Windows where it belongs - in the 90's.

This does not help that much... I need to see this Web 2.x web pages... can you post here some URL's or screenshot of something that is "Web 2.x age" for you?

2. Limits to classes - This is petty really. Just offer a tool and get out of the way. If I buy a hammer from the hardware store I would laugh at them if they told me I was limited to how many items I could use it on. It costs NOTHIING for me to use that hammer more or less to my heart's desire. The same is true of classes - it just makes no sense to expect me to pay more for something that seems to be just arbitrarily set.

We are studying our new offer and I think that those limits will be gone soon.

3. Limited support - Any product is going to need a ROBUST amount of resources to ensure success- after all, if the dev is not successful, what is the likelihood he/she will continue to use the product or refer it to someone else? The Inde forums is lacking a large community, the documentation is prolific but not effective or efficient and there are no video tutorials (really a must have these days).

IMHO every forum is lacking a large community, until a large community uses the product. At the beginning even Visual Studio or XCode lacked that large community. We have a lot of documentation (more than 5000 articles)... we have video courses (yes, video classes with a teacher) and we have one-to-one support if it's needed... Everything can be better but what about others? Is their documentation better than ours? I spend a lot of time studing Objective-C, HTML5, C++, C#, Visual Studio, Java documentation and I always see the same "lack of what I need". Then I start searching the web and I get some hints on how to solve my problems. With InDe you can't search the web (yet!) but I'm sure time will change things. And, BTW, we are increasing documentation and video lessons every day... the same for our forum.

I appreciate (a lot, really) your suggestions and I keep seeing them as constructive... Tought I need more help from you, in particular for the "Web 2.x age UI"... I need to understand more what you expect and a screen shot or some urls will help me more.

But I'd like to add my two cents as well. InDe has a lot more than just the UI. InDe makes the difference because it changes HOW you program not just what you get as an output. When we started InDe were producing ONLY VB6.0 client applications... we had less clients but they were developing old VB6 apps... then we added the Java/servlet compiler and our clients changed the compiler and got a full working web app from their original windows forms app... then we added the C# compiler and, again, they were able to compile their app in an ASP.NET app... then we added mobile compiler, offline compiler, databases... I usually say to my clients: "I take care of caos and complexity and you take care of the business logic". That's why I do belive that InDe, IMHO, is way more than just a UI to HTML translator.
User avatar
lucabaldini
Pro Gamma
Pro Gamma
 
Posts: 4990
Joined: 1 October 2010, 17:03
Location: Bologna

Re: Customizing the UI and Widgets

Postby josevelez » 30 May 2014, 13:29

Luca,

I will provide some links to solution providers that offer similar tools that have nice UI's that I think represent more modern web 2.x themes. See below.

That is really fantastic news about the classes. I really think this is an unnecessary barrier to put up. I hope Inde decides to remove limits to classes and perhaps instead price based on the number of developers. That makes more sense.

There are some similar offerings that have much more active communities (Wakanda, Alpha Software, Wavemaker, etc.. to name a few). I am not saying the products are better, I am saying that they at least have an active community.

For example, I have been evaluating a product called AwareIM and while I really like the product, their forums are like ghost towns. To me there is nothing scarier than seeing a forum where many posts go unanswered or if they do they are answered days later by one of a few active contributors. That is not a community, its a small ongoing conversation between a few folks that could end anytime. Inde does deserve credit for being very active in the forums - that is a major plus.

I agree 100% with you that Inde has some major strengths as you mentioned. There are some features that Inde has that really set it apart. Great work! But don't pat yourself on the back just yet and keep looking how you can make the perfect tool that developers wont just settle with because nothing else currently exists that meets their needs. I should probably mention that my definition of developer is not just someone who is a programmer (by profession or hobby) that know all the intricacies of software development. My definition is one that represents anyone that has an idea for an application that wants to get it built with existing tools. 10 years ago only a developer could bring a software idea to fruition but these days with current technology the ability has poured into the hands of everyday folks (like me) who know nothing about programming and just want to "build an application". In my opinion, this is where the biggest market is. Something that programmers can use to quickly serve their clients needs but also something that enables the average Joe to build his/her own application.

I recommend you spend some time and look at the UI's used by the following: Some are better than others but I think they are all better than what Inde currently offers. Inde REALLY needs to get away from the "Windows" theme. I'm a millennial/Gen Xer and trust me, its not cool and it wont attract younger customers. I really hope I do not offend anyone with this comment, I mean it only to provide some context. Again, just trying to offer constructive criticism for what I think is a great product that just needs a little more polish!

John, my apologies for hijacking your thread. Luca, John is absolutely correct when he said,
Bottom line ... it's hard to accept your response which I'll summarize as ... "Yes, it can be done. It will take a lot of time. And good luck figuring out how to do it." :-)


If Inde is not going to update its UI, than at least make it VERY easy to do so ourselves without having to spend a lot of time and NO money. UI is part of the package and it needs to be treated as such. I wouldn't buy a car only to have to take it and get painted because it only has primer on it.

Take a look at these UI's

Wakanda - http://www.wakanda.org
AwareIM - http://awareim.com
Caspio - http://www.caspio.com
Wavemaker - http://www.wavemaker.com

Jose
josevelez
 
Posts: 404
Joined: 7 June 2013, 17:25
Location: Dallas, Texas

Re: Customizing the UI and Widgets

Postby johntalbott » 2 June 2014, 19:22

lucabaldini wrote:I keep thinking at your last sentence and I've a question for you... You say

clients expect great looking modern (web 2.x) UI's.


I'm curious to undestand this a little bit more... What you you mean with "modern web 2.x UI's"? I think our interfaces are modern web 2.x UI and you can customize them a lot just by configuring Visual Styles and changing icons and CSS colors.
But, maybe, I'm wrong. So I'd like to understand more about this.

Do you have an example of a modern web 2.x UI's that you can't do with InDe? I'd like to see it because I'm sure that you can get it without 3rd party components or widgets... The majority of my clients are not importing widgets because they don't need them. So I'd like to see an example of something that you'd like to obtain... I'm pretty sure that it can be done with InDe.


Thanks for your engagement in this discussion. Here are a couple UI examples that might help ...

1. Here is a live demo to check out. https://demos.devexpress.com/RWA/ClinicalStudy/ (Screenshot below)
I have a project that would lend itself to something similar to this.

2. Here is a super simple To Do application .. that has a nice look & feel. http://todo.breezejs.com/

Clinical Study Screenshot
clinicalstudydemo.PNG
clinicalstudydemo.PNG (99.41 KiB) Viewed 27390 times
johntalbott
 
Posts: 141
Joined: 16 March 2014, 21:33

PreviousNext

Return to Tips & Tricks

Who is online

Users browsing this forum: No registered users and 9 guests