Re: In Preview: New UI design for desktop users - Page 15

Arthur_Rallu · 08-02-2022 12:58 PM

Hey everyone,

We’re excited to announce we are now previewing our new visual design for applications that are accessed on desktop browsers.

Currently, your AppSheet applications tend to follow mobile design patterns even when your users have large screens and these patterns can be confusing to desktop users. The new design lets these desktop users navigate their apps more easily and access information in context, and provides an efficient way to create and update records without losing context. App creators can also present more information by leveraging the larger screens but still keep it organized.

Here are some before and after images that better illustrate the design changes.

Legacy Design - Screenshot #1: Sifting through a collection of records grouped by City and State after selecting a State (Deck View)

Legacy Design - Screenshot #2: Looking at a specific record after selecting that record in the screen above (Detail View)

Legacy Design - Screenshot #3: Editing an existing record/Creating a new record (Form View)

New Design - Screenshot #1: Seeing your data in context (Deck View + Detail View)

New Design - Screenshot #2: Focusing on a specific record (Detail View)

New Design - Screenshot #3: Editing in place an existing record

New Design - Screenshot #4: Creating a new record (Form View)

What’s next? Well, this is still a work in progress. We’ve been gathering feedback from a number of design partners, including some of you in the AppSheet Community, and we know there is more to do before it can properly support all of your applications. At this stage, we feel that it would be good to let you play with the new design and to give you an opportunity to share your feedback - what you like, what doesn't work, what you think could use some improvements. This represents a significant change and your feedback will help us guide our next steps.

As this feature is in Preview, you may see visual changes in your apps as we work to improve the new desktop design in real-time. We don't recommend using the new desktop design in your production apps.

Thank you

The AppSheet Team

FAQ

How do I get access to this new desktop design?

We are currently slowly ramping this new experience over the next week or so, so you may not see this option in the editor immediately.

For each application, you can opt-in to use the new desktop design. You can toggle between the new and legacy desktop modes, as desired.

Follow these steps to enable the new design in your app:

Open the app in the app editor
Navigate to the UX > Options pane
Enable the Desktop mode (Preview) option - see screenshot below
Save the app in the Editor

All users of this application that access the app on a desktop browser will then see the new design after their next sync.

How do I configure the design of my app? I don’t see any new settings in the Editor!

There are minimal changes to the Editor for now. Mostly, the same settings are leveraged to specify the desktop and mobile designs. Let me give you an example.

Your apps have “primary views” and “menu views”. With the new desktop design, all of your views will be accessible from a side menu. That menu will list first the “primary views” and then the “secondary views”. In the future, we will adjust the configuration settings and in particular the language so that it makes sense for both mobile and desktop apps. For example, position values of "left most" and "right most" don't make sense for the new desktop design with its vertical menu structure.

We’ll be giving app creators more controls over some features that are currently set by default.

Is there some documentation or more information on what changed?
See Optimize the user experience using the new desktop design (Preview). We’ll update it over time.

Is there a list of functionalities that are known to not work with the new design?

Yes.
First, here is a list [as of July 31st] of (high-level) issues and requests that were reported to us and that still need fixes or assessments. Some of them are independent of the desktop mode, but we're still listing them here since people may want to know about them and so they don't need to report them unless it was reported for different app configurations :

General theme	Issues
Form View	Follow-up actions (reopen, next view, click-on-save action) do not get triggered or executed properly; sometimes it is dependent of the app configuration and sometimes it is not Delete and Done buttons are missing to delete new child row Some performance issue when there are many Enum value buttons and format rule(s)
Navigation expressions: LINKTOROW(), LINKTOFORM(), etc	When used in emails When used to go to Dashboard Views
Format rules	They don’t properly show up in a dropdown (for Enum, Ref, etc) They don't always show up in the group-by section They don’t show up new headers
Detail View UI	- In some configurations, showing the wrong display names in a Detail tab - Requests to show the image label in the Detail tab - Edit-in-place in Dashboard view - Sync gets the app user out of Editing mode in a Detail View
General UI	- Improvement requests on the subnav bar (e.g. larger text button, better responsiveness w.r.t. title, actions, text) - Clicking in grey area around onboarding view should not navigate the app in the background - Filtering on Dashboard - Tooltip for icon action buttons - Chart Views do not behave like other views
Localization of strings	Some strings are missing
CSV import/export	Error message when action was successful Export data based on what is visible to the user
Other app functionalities	- Missing Share, Feedback buttons - App Gallery behaving differently - Support of Amazon Cognito (missing account icon) - OCR not working on Desktop
Functionalities for app creators	“Preview as” is not available for the desktop emulator

Second, here is a list of some issues and feature requests that we know we are not going to tackle, at least for now.

Supporting multiple navigation actions in a grouped action	This is not something that we support. The team very intentionally did not want to support this. App creators should not rely on it and it won’t work in desktop mode.
Multiple requests to improve the Table View UI	We got requests to improve the Table View in general. The requests are valid, but that is out of scope for desktop mode. Changes we would be making would also impact the legacy UI and mobile apps.
LINKTOPARENTVIEW() not supported	For desktop users, there are better options to navigate back: the browser’s back button and the breadcrumbs.
Font size changes (via app settings) lead to layout issues	Generally, we recommend using the browser’s zoom which does a better job at resizing the app.
Background image

See also Limitations and known issues.

How do I provide feedback?

Please share your feedback in this thread below this message!

scott192

Is there a list of functionalities that are known to not work with the new design?

Yes, here is an initial updated list [as of Jan 6th] :

Background images are currently not supported
Chart Views are not working properly
Forms show incorrect values when computed from expression
Form do not advance automatically
REF columns always show as dropdown (even if the app creator chose "button" option)
"All" button is not localizable
Slow performance when multiple actions are triggered at the same time or consecutively
Customized deep links not always directing the user to the proper page
SNAPSHOT() not supported
Record selected in an inline view is not highlighted
Form's "Event action" not supported

KON_TROLL

Well this list must be less than 10% of current issues with the new design?!

I dont't want to be negative here because I love the new design, but I feel there is a looong way to go before we can use this new design. If Appsheet could make a list based on issues in this tread, it would be a long list....

ghost5

Hi,

I've always used the new view for my production apps as it came out around the time I started using AppSheet. I have only noticed this over the last month but maybe I am mistaken... when opening the webpage from the shared link it appears to try to load the old version first, then immediately reloads and opens and opens the new interface.

Is this by design until everything is finalised? Is there any way I can get it to just open the new interface?

Many thanks,

SkrOYC

@ghost5 wrote:

Is this by design until everything is finalised? Is there any way I can get it to just open the new interface?

I'd say both yes.
It should be by design because when it syncs it checks the screen resolution to decide whether to use the Mobile or Desktop mode.

To open directly into the Desktop Mode, add "?platform=desktop" to the end of the link, after the UUID, like this:

"https://www.appsheet.com/start/c37bc8a4-6b53-4e71-812c-2348072cbf2e?platform=desktop"

ghost5

Hi,

Thanks for replying. Yes all my bookmarks do have desktop in them. I've just re-opened them all and they all opened in the new preview view immediately. Maybe there's some backend stuff going on, or something with my browser. I'll keep my eye on it.

sandeepraon

@Arthur_Rallu Please would greatly appreciate any response on this comment. any update when can the desktop mode will be more available for production ready apps?

currently seems like its only in preview and not available in production apps. any tentative time frames,

Our production apps would really be benefitted with this view. considering the value behind browsing the app in a browser, we cannot role out this to few of our users and which is a critical milestone in our app release strategy going forward.

any TBA dates or road map on this feature is much appreciated. so that can help our release dates for the app to the business users.

1minManager

Another potential new bug spotted with the new UI. I have an app where it sends the training contact of a company an email when one if their employees is booked on a particular course. The formula is a bit tortuous because its not as simple as just using a single Ref column to get to another table. Its located in the "To" box of the email settings within the Bot.

IF(
   [People].[Company]="dea2fa91",
   [People].[Email],
   ANY(Select(People[Email],[PeopleID]=
      ANY(Select(Company[Training Contact],[CompanyID]=[_ThisRow].[Company]))
   ))
)

Anyway, the formula was working fine up to midnight monday. Then it stopped working. So the bot was triggering, and emailing all the BCC contacts (which were just straight email addresses). It just wasn't emailing the "To" box.

Process already done:

Checked that nothing had changed in that section of the app. I had added an additonal BCC contact on Tues evening, but this was AFTER the "To" had stopped working. So that section of the App stopped working all on its own
Checked in Bot Monitor. All was working fine but "To" was blank

{
"Task Type":"Email",
"Task Name":"Elsewhere Joining Instructions Task - 1",
"EmailTo":"",
"EmailCC":"",
"EmailBCC":"***@****,****@****",
"EmailFromDisplay":"****",
"EmailReplyTo":"****@****",
"EmailPreHeader":"",
"EmailSubaccount":"",
"EmailSubject":"Course joining instructions",
"EmailTitle":"Alert: Add to application ****",
"EmailMessageChannelName":"System Default",
"EmailIsDynamic":false
}

Wondered if this was to do with some security filters somewhere. So I turned on "Bypass Security Filters?" which did nothing. But also the email body template was pulling data from 4 different tables and this was working fine.
Added a virtual column to the table that called the bot, using the above "To" formula, and the desired email address showed up fine. So the formula was not the cause.
Contacted Appsheet support. Spent the first 30mins talking to someone only to be told that I had contacted then via my Starter licence account and instead needed to redo the process from scratch from my Core account 😡. So redid that and was on for what felt like an hour only to be told that "We're going to have to refer this..." Total waste of time
So with no other options and one angry client, I decided to simply point the "To" formula at the virtual column earlier that calculated the email address. That worked 🤔

Before everyone rips into to me... YES I KNOW THE NEW UI ISNT FOR PRODUCTION APPS! But in this specific application its much more functional that the old UI so I'm happy to deal with the odd weird bug from time to time. I'm posting here simply to make Appsheet aware, and for other Devs that might come across a simliar problem realise its probably not their fault.

@Arthur_Rallu can you please relay this to the relevant people?

scott192

I know it's a shot in the dark and I can't understand why it was working and now suddenly doesn't work anymore, but could you try your TO: expression using LIST to wrap around your unique id for the company?

IF(
   [People].[Company]=LIST("dea2fa91"),
   [People].[Email],
   ANY(Select(People[Email],[PeopleID]=
      ANY(Select(Company[Training Contact],[CompanyID]=[_ThisRow].[Company]))
   ))
)

You of course know that you can also do [People].[Company].[CompanyName] = "Acme Holding LTD" if your data is structured that way?

Sorry if that seems a ridiculous suggestion...it's a quick one to try though 😁

Arthur_Rallu

Weird.

Do you know if this happens when you turn off desktop mode? Since this "To" field is specified in the bot, it should be independent of the UI. Or did I miss something?

SkrOYC

Try changing ANY() with INDEX(XXXX, 1).
We have found sometimes that ANY() likes to change the format of the value

@MultiTech

lizlynch

Hi,

The following enhancements/bugs were addressed in the January 12, 2023 release notes:

Enhancement	For desktop UI (preview), the Sync indicator now shows when an automatic background sync is in progress.
Bug	For desktop UI (preview), a bug was fixed for Desktop UI drill-down tree not updating after user-defined filter is applied.

Thank you,
Liz

Axel_Pro

Thanks a lot for the update!
It's amazing!

Is it possible to implement a submenu that appears on hover?
(Like in the admin panel of the application)

Arthur_Rallu

We thought about it and considered but decided to leave this out.

Axel_Pro

Thanks for the answer @Arthur_Rallu !

I would be grateful if this is implemented in the future )

Axel_Pro

Hi,

Error - in the drop-down list, the lines "run into" each other if the value takes more than 2 lines

Testing was carried out on creating a virtual column with data:

LABEL short length - displayed normally (2 rows label):

Testing was carried out on creating a virtual column with data:

In the old version everything works fine:

Even with a very long LABEL:

PatW

Thanks! Tracking this internally as 266580364

Alejandra_Torre

Hello,

I understand this is still in development, but to report issues/bugs coming from this feature, do I need to contact support or is there a designated thread? Thanks

Thanks.

checktheclaws

Hi,

I guess I'm having a bug.

I have a form that the user can approve a payment.

The problem is that some dropdown fields can be changed, even though these are (or should be) non editable in these forms.
These are REF dropdowns.

Here are some screens:

This is the form without change.

If you click on this X, the field disappears and the value returns blank in the record and Database when the form is saved.

If you click on the arrow down, it gets the dropdown and you can change the value of this field. (The form works perfectly in old version and mobile. It doesn't let the user change anything, since there is a editable if expression that prevents it.)

When I click the X the fields are gone and the value is set to empty in the record.

Here's the configuration of these fields. (Note the EditableIf expression)

So I believe it's something that is not done yet by the Appsheet Team.
I'm just pointing this out to contribute to a better platform in the near future.

Thank you all for your efforts.

Saavan

Can you confirm if you are still seeing this issue?

Thanks

Arthur_Rallu

@checktheclaws Are you still seeing this issue? We recently released a fix. Previously, a new record in a Form that was yet saved would be included in global computations of expressions. That was a behavior different from the one on mobile. The fix ensures that the new record is not taken into account unti the user Saves the Form. You should not be seeing this issue anymore.
Thank you

checktheclaws

@Arthur_Rallu @Saavan
Now it is working like a charm. It doesn't let the field be edited.

Another issue I was having, was that when I was editing a record, the values were going to the table even before it was saved, but now I guess it is fixed.

Ps. Loved the design, by the way.

Here's a screen on how it is now:

Thank you!

Koichi_Tsuji

@Arthur_Rallu @Adam-google

As previously discussed, when we got the complex grouped action to change data, new Appsheet desktop UX keep freezing. No response after firing the actions. It also throw the strange error message, and abort the data change operation. IF the same action is fired on the legacy UX, it working fine, but it does freeze on the new desktop UX........ Really need a fix to it.

PatW

Agreed, this is actively looked at right now. The performance issue we understand the root cause and Adam is putting together a fix.

The strange errors might be new and might be worth looking more into. We are in the process of rolling out some changes to how desktop handles saving so that may address the error messages, but performance issues will take a little longer.

AbdullohShams

"Max" expression is not working properly in new desktop preview, I try to explain it with an example:

We have groups that each has unique group number. In database, the largest group number in database is 7, for example.

Group number is calculated using this formula max(SELECT(Groups[GroupNumber], AND([BranchID]=[_THISROW].[BranchID], [CourseID]=[_THISROW].[CourseID]), true))+1

It should return 8 number, but, in desktop it adds extra one number when editing other columns of this row. For example, if a row has 5 editable columns it adds extra 5 number in calculation in new desktop preview. In our case it returns 12 instead of 8, however, mobile version returns correct 8 number.

PatW

Are you able to share or enable support for this app? I don't think I fully understand the issue as described and it's probably easier for me to see the behavior directly.

AbdullohShams

I've enabled support for this app:

ID: 76819147
Email: <PII removed by staff>
App: CodialERP-76819147

Table for look at: Groups
Column: Group number
Problem: max expression calculates wrong in desktop, especially when using it in initial value and data validity

nphuoctuan

I also have this problem for both expressions using Max() and Maxrow(). The results are not displayed as on the mobile version. I replaced it with the expression Index(Orderby(Table,Sort_Column,True),1). Everything is ok again.

Shock

Edit form in Desktop View only allows me to edit Detailed view options.

lizlynch

Hi,

The following issues have been address in the release on January 24, 2023.

*Item*	*Description*
Bug	For Desktop UI (preview), fixed inconsistent expression results in Desktop forms. Certain expressions were producing different results in Desktop mode, specifically those that involve searches (e.g. `SELECT()` or `LOOKUP()`) over the same table currently being edited in the form. With Desktop mode off, the pending changes in the unsaved form are not included in the result. With Desktop mode on, they were being included. After this change, they will again be omitted from the result.
Bug	For Desktop UI (preview), do not show validation errors in detail view on desktop if the row is not modified.

Merit

when using max () with select() formula in initial value, it returns wrong results as it adds extra 1 value to the result when you try to change other columns of the current row although formula was in initial value.

Actually, it is working in mobile mode properly, but, calculating wrong in new desktop preview. Please, see it.

I've sent a private message to @amyplin with detail info and shared the app with my another free account.

Formula is: max(select(Table(Column), [Criteria1]=[_thisrow].[Criteria1] ))+1

PatW

We have a fix for this issue that's being rolled out now and will probably reach everyone by end of next week or so. Otherwise if you want to PM me your userid/email I can go ahead and turn it on for your apps immediately.

SkrOYC

@lizlynch wrote:

For Desktop UI (preview), fixed inconsistent expression results in Desktop forms. Certain expressions were producing different results in Desktop mode, specifically those that involve searches (e.g. SELECT() or LOOKUP()) over the same table currently being edited in the form. With Desktop mode off, the pending changes in the unsaved form are not included in the result. With Desktop mode on, they were being included. After this change, they will again be omitted from the result

Thanks!

Jordan_Davis1

I'm still having an issue with the CSV exports in desktop mode. If I filter a table and then export it, the export includes all data, not just the filtered data. Is there any fix for this?

Arthur_Rallu

thanks for letting us know.

Arthur_Rallu

@Jordan_Davis1 Are you still seeing this? If you are, please give us more details on your app configuration so we can fix it.
Thank you

SkrOYC

Optimize the user experience using the new desktop design (Preview) - AppSheet Help

JPAlpano

Hi @Arthur_Rallu ,

I saw the new option in the system-generated "Edit" button, allowing us to choose to either Edit in Place or Open a Form.

This is great! This saves us the time of having to create a custom Edit button with LINKTOFORM() deep-links.

I'm just wondering if the same can be implemented when selecting a record from a primary view (table or deck) using Desktop UI to open the Details screen of the selected record?
Currently, it shows the Detail view using either a split screen of full screen view. Would be great if we can also have the Detail view open as an overlay.

Having the Detail view as overlay may allow even Appsheet to know exactly what is the current view and, who knows, maybe even somewhete address the issues of CONTEXT() and CSV Import/Export not working.

Hope you consider looking into it. Thanks.

Arthur_Rallu

There is now a "Desktop layout" setting for each Detail View. That lets app creators decide whether to open in a split configuration or as a separate page - see https://support.google.com/appsheet/answer/10106385?hl=en

Note that CONTEXT() issues have been addressed. Let us know if you have another situation where it's not working properly. Same for CSV import and export.

Gasparfran

Cuando intento modificar un campo a través de la acción imput el mismo desaparece, no obstante cuando grabo el cambio si se refleja en la hoja de calculo.

Desde el teléfono o la vista de edición no me genera problemas, solamente desde la vista de escritorio.

Si cambio la interface y vuelvo a la anterior no tengo ningún error.

Arthur_Rallu

Could you provide one or two screenshots? I'm not sure I understand what you say that it disappears. Is it the entire field or the value? And then, what view is this happening in (Detail, Deck, ...) ?

Thanks