Download as pdf or txt
Download as pdf or txt
You are on page 1of 17

5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

 support@gingerhelp.com

A N I N T R O TO E P I C O R
K I N E T I C C U STO M I Z AT I O N S
F O R D E V E LO P E R S
ADAM ELLIS · JULY 31, 2021

INTRO

As somebody who has spent over 20 years now learning all of the tips /
tricks / hacks to make Epicor ERP bend to the needs of my varied
customers, the news that classic forms were going away in a few years
was a bit alarming. So many of the creative techniques we have
employed over the years came from the virtue of having this mini Visual
Studio available on just about every form in the system - the possibilities
were truly endless. I loved what Epicor created in what we are now
calling “classic forms” and I was admittedly very skeptical that we could
really replace it with this new no-code / drag-and-drop Application Studio.
But I have seen the light - this technology is amazing and the little bit of
pain we will go through right now to modernize will pay massive
dividends over the years to come.

GIVE IT A FRESH SET OF EYES

First off, I think it might be worth noting that the Kinetic you are seeing
right now in the desktop client is really a transitional version that does
itself a bit of a disservice. If you are like me, you snoozed the suggestion
to try the Kinetic forms many times because they were slower and felt out
of place amongst the classic forms. The latency, the best I can tell, has

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 1/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

nothing to do with how performant the toolkit is but rather the inefficiency
of loading a unique web view up for every form. To that end, before you
judge Kinetic you really owe it to yourself to try in where it is made to be
run - in a web browser. If you are on newer release you should be able to
do this right now - simply point your web browser to:

https://YOURAPPSERVER/YOUREPICORINSTANCE/Apps/Erp/Home

If you are cloud it will be something like this:

https://centralusdtappXX.epicorsaas.com/SaaSXXX/Apps/Erp/Home

You will see the familiar Home screen:

Try loading up a few modules in here and you will see what I mean about
the desktop client doing a disservice to Kinetic - the transition between
screens here is fast, everything feels cohesive, your web browser renders
the fonts nicer, everything scrolls smoother, etc. And I think you will really
start to appreciate some of the thoughtful redesign of various applications
in the context of a web browser - take customer tracker, for example, they
start off by immediately saving you your first few clicks that might be
painful on something like a tablet by bringing up a customer list right away
with focus in the field to select a specific customer ID:

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 2/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

Or you can still get to the traditional search by pressing the search button:

And when you actually select a customer you again get a re-imagined
screen that ditches the million tabs for clean expandable / collapsable
sections in a single view:

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 3/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

LEARNING VIA EXAMPLE: ADDING A UD FIELD


TO THE SCREEN

So let’s dig right in and I will explain new terminology and concepts as we
go along. We are going to add a UD field to the customer tracker to let us
know whether a given customer requires order verifications. Adding a
UD field, by the way, cannot currently be done in Kinetic / via web
browser - you will still need to do that via classic forms / desktop client.
Epicor has understandably focused on the end-user facing forms first and
will be uplifting the system management forms later on.

In order to add our field, your user will need to have ‘Customize’
privileges within user maintenance just as with classic forms. And, as with
classic forms, you will get into “customization mode” first by launching the
application you wish to customize. Then, in the upper right select the
vertical overflow menu (the three dots) and choose Application Studio:

Now we are going to see the Application Map, which we will go into more
detail on in a moment, but first let’s define our new layer for the

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 4/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

customization we are making. Layers are a new concept rooted in


something you are likely already familiar with. In classic forms, any time
that we made a customization it was stored in the database as the sort of
delta versus the base form. That is to say, if I added a checkbox onto the
main panel in Customer Tracker all that was stored in the database was
the X / Y coordinates of that new checkbox, how it was bound, etc.
Everything you did in the customization dialog, including code, was stored
in this manner so that when the form loads it starts off as base and then
layers in whatever you defined in the customization. Kinetic is similar in
this regard with a key difference - you can now stack multiple layers
together for a given application. Why would this be important? Well it
gives us some really nice new capabilities we didn’t have before:

1. It provides a sort of self-documentation of what exactly is going on.


In classic forms it was really hard sometimes to know what had
been changed over time as you had to rely on what developers
typed within the comments box on save. With multiple layers you
can now isolate groups of changes into their own layers so it is clear
what was done.

2. That isolation of layers also makes it easier to merge in new work


that has been staged / approved. If you have ever had multiple
developers working on the same form at once, this one will
resonate particularly well with you. It was a nightmare before to
coordinate - now you can just have each developer work on their
own layer and apply them upon approval.

3. It also makes removing deprecated customizations easier. Just pull


the layer out - easy.

4. Lastly, it gives us a form of “source control” for a no-code tool that


doesn’t really have source code. Layer your work out and, if
something goes awry, pull the layer back out and you are back to
where you were.

So, to that end, let’s create a new layer here for our UD field. Start by
clicking the ‘New Layer’ link in the upper right:
https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 5/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

Now fill in the details for this layer and press the ‘Save Layer’ link:

WARNING: At the moment, the description field seems to be limited to 60


characters even though it allows you to type an unlimited number of
characters. You will get a non-descriptive error if you try to save
exceeding this limit.

FYI: This one took me by surprise a bit, but the layers for Customer
Tracker are also shared with Customer Entry. Tracker simply makes
everything read-only, as you’d expect.

Now we are returned back to the Application Map working within our
newly created layer:

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 6/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

So now let’s talk about this Application Map a bit more. The Application
Map is the way to visualize the entirety of an application. You are going to
start off with what is called the Landing Page as the top-most object in the
Application Map. Think about this like that first panel you’d encounter
when you launch a classic form. You can see that by clicking on that first
‘Customer’ object and then clicking the ‘edit’ icon within it:

Notice how when we launched Customer Tracker earlier it started off in


the search / list view - that is exactly what we are seeing here. The
Landing Page for Customer Tracker is this search view and if you don’t
like it, you can change it. We are looking to add our UD field to the
selected customer view so close out of the designer for the Landing Page
by clicking the ‘X’ here (you will need to hover over it to see it):

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 7/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

If we are back in Application Map we will see the next object down has a
tab icon on it. If you click the edit icon for this one you will get an editor
like so:

This view aligns with what we get when we select a customer. You will
notice there is a header, which is now to be referred to as the Hero Bar
and tabs for ‘Activity’ and ‘Details’ below. Within this editor we can add
components, but not within the tab pages. In order to add widgets to the
tab pages, we need to close out here and drill down one more level into
the Application Map (notice how these two objects, Activity and Details,
align with the tab names we reviewed on the previous screen):

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 8/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

Now we will be in the correct designer. Let’s say that we wish to add our
custom checkbox right where all of the other checkboxes are under
‘Status’. In order to do so, start by dragging a checkbox component from
the Toolbox to where you want it:

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 9/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

Now with the custom checkbox in place, click on it and then click on the
Properties tab:

As we would typically do with classic forms, now would be the time to


provide it with a more verbose ID for this new component and a label. In
Kinetic there is no need to drag a separate label onto the screen as it is
“baked into” the control. Also expand Data and fill in
Customer.OrderVerificationsRequired_c (that is what I named my UD
column, adjust accordingly).

Now we are ready to test this work out. In order to do so, press the
Preview button in the upper-right:

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 10/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

In preview mode you can fully test the application out and ensure that
everything operates as expected. When you are done previewing, click
the little ‘X’ next to the ‘Preview’ text:

Now let’s get this layer set as the default for our users. Start by clicking
the Save button and then click ‘Publish’ on the overflow menu:

Then exit out of Application Studio by clicking ‘Exit’ also on that overflow
menu and pull up Menu Maintenance on a full desktop client in classic
forms (as noted before, most of these management tools have not yet
been uplifted to Kinetic). In order configure a Kinetic menu entry with
custom layers applied you need to first copy your existing menu entry:

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 11/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

And set the new menu entry up per the following. You might be asking
yourself while filling this out “why am I picking Customer Entry instead of
Customer Tracker” and also “why is there no Customer Tracker on the
list”? As mentioned earlier, it seems that Customer Entry and Customer
Tracker share the same application in Kinetic and that some values within
this copied menu entry tell it whether to run in “tracker mode” or “edit
mode”.

And that should be it, just close and re-open and you should see the layer
defaulted.

NEXT STEPS
https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 12/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

So obviously we are just scratching the surface here and it will take many
more articles for me to help clarify the parity in between what we can do
with customizations in Classic forms vs Epicor Kinetic applications as
developers. But while you wait for those articles, let me briefly spell out
“the big picture” as I understand it:

• The ‘Events’ section is pretty powerful and really changes the game
by eliminating some of the tedious stuff we used to do in order to
trigger BPMs / cause UI changes.

• While you cannot write code in Application Studio, you can call
Functions which really provides parity for a ton of what we would
have done in classic forms. No new language to learn and code is
more centrally managed.

• Slide Out Panels are a better way to split up applications and


eliminate the clutter. I cannot tell you how much code I have written
over the years that conditionally show/hides screen elements to try
to manage complex data, especially in order entry. I can see how
these little slide-out panels will vastly improve the way we do things.

• Data views are more powerful now, eliminating a lot of code we


would have used in the past to pull in extra data.

• “No code” does not mean “no developers”. This is still going to be
a craft that requires development expertise and mastering
incredibly complex sets of properties to configure functionality. I
believe to effectively develop the sorts of customizations required
by many Kinetic customers you will still need a solid understanding
of C# for the Functions. You don’t need to know anything about
web front-end development, just the nuances of Application Studio.

• There are going to be some things we simply cannot do anymore.


One example is work I did for a customer that embedded some
TWAIN library in various classic form screens so they could simply
put a piece of paper in a scanner, hit a button, and we scanned +
attached a PDF to the loaded record. That required bringing in a
3rd party DLL and there is just no way that will work under the new
https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 13/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

framework. But you know what, there were things we couldn’t do in


classic forms either that we can do now in Kinetic. We will adapt :)

Anyway, I hope this helps - let me know your thoughts. I always like
hearing from you all!

AUTHOR: Adam
Ellis
Adam Ellis is the owner of
GingerHelp. Adam is a lifelong
entrepreneur and has extensive ERP
and mobile software knowledge
through his consulting and
management experience. He has a
passion for exploring innovative ideas
and how they can change the status
quo. Connect with Adam on LinkedIn
to learn more about his involvement
in the ERP space.

FACEBOOK TWI TTER PINTEREST 7 LIKES

COMMENTS (4) Newest First

Preview POST COMMENT…

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 14/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

Antonio 11 months ago · 0 Likes

Hello.

Do you use the Epicor Kinetic Warehouse app?


I'm looking for a manual or something but I can't find it.
Can you help me with that?
Thanks.

Les Nyberg 2 years ago · 0 Likes

Thanks Adam! The explanation was concise, educational and answered the question I
had. I'm just getting started on converting our customizations to Kinetic format and
was able to create a new layer with a simple disable on a field but it wasn't showing
up in Kinetic and now I know the step I missed.

I'm going to save this as a favorite for future endeavors as I'm sure I'll need to go back
to it again in future.

TP 2 years ago · 0 Likes

This is cool, thank you for the insight. I will be using to handle some classic screens
that have a few UD fields.

I am also interested in converting customizations that have code to application studio.

Rob McMillen 2 years ago · 0 Likes

Great introduction! Thanks for putting this together!

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 15/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

PREVIOUS

ADDING NEW COLUMNS TO EXISTING EPICOR KINETIC


SCREENS
EPICOR CUSTOMIZATION, EPICOR ERP

NEXT

QUICK AND EASY EPICOR DATA LOOKUPS VIA CODE IN


CUSTOMIZATIONS
EPICOR CUSTOMIZATION, EPICOR ERP

LET’S CHAT!

CONTACT US

GINGERHELP, SERVIC PRODU KNOWLEDGE


LLC ES CTS BASE

8685 Fox Epicor ERP Epicor ERP Epicor ERP Articles


Lake Road Consulting Extensions Infor VISUAL Articles
Sterling, OH P21 ERP Infor Dynamics 365
44276 USA Consulting VISUAL ERP Articles
Infor Extensions Crystal Reports
 VISUAL ERP Articles
support@gingerhelp.com Consulting SSRS Articles
Dynamics Bezlio for Mobile
365 ERP Articles

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 16/17
5/16/24, 3:13 PM Intro to Epicor Kinetic Customizations for Developers — GingerHelp

Consulting
SSRS
Developer
Services
Crystal
Reports
Consulting

GingerHelp is an
independent consulting
practice with no direct
© 2019 - 2023 GingerHelp,
affiliation with Epicor® or
LLC
Infor®.

Terms & Conditions |


Epicor®, Vantage®, and Privacy Policy
Prophet 21™ are registered
trademarks of Epicor
Software Corporation®.
Infor® and VIUSAL® are
registered trademarks of
Infor®.
Crystal Reports® is a
registered trademark of SAP
AG.

https://www.gingerhelp.com/knowledgebase-epicor-erp/an-overview-of-kinetic-for-developers 17/17

You might also like