Responsive Title, Difficulty correcting object alignment in phone modes

Upon review of the attached screen shots you can see I have a simple object group that becomes misaligned in phone modes when I "Run" the module in "Run" mode however as you can see the misalignment is not reflected in the edit mode. How do I make the necessary changes if I can't see the problem reflected in edit mode. What am I missing here?

Phone-Landscape.jpgPhone-Portrait.jpgCell-Phone-Landscape.jpg

Discussion (13)

What is your Windows DPI setting? Looks like 150% or something. I think it should be 100% for Lectora to function correctly. See this instruction on how to change this.

Thanks for the suggestion but nope that's not it. Same issue even after I changed the dpi. One thing I did notice this morning when I experimented...The object is properly aligned going into the mod (ie: it's first position), but as soon as I initiate a first swipe it moves the x and y off their programmed positions. Then after that everything stays on the same y (be it newly altered y) axis and the x moves as it should but is incorrectly aligned. Re: the x axis The distance the objects move is shorter, which makes sense but it is misaligned after the first swipe so therefore it remains misaligned for the remainder of the interaction.

See attached screen shots.

Furthermore what concerns me is that I can't see the problem in edit mode it only surfaces in the review modes.

Any assistance from anyone who can help me with this problem is greatly appreciated. I really want to be able to USE responsive design... little hard to do that if I can't see the problem in edit mode to fix it. Again maybe I am missing something fundamental here.

before.jpgafter1.jpgafter2.jpg

Can you share the file, so we can take a look?

Tim

Here you go

Well I guess I stumped everybody on this one. I have been tied up on editing and animating on video projects and have just gotten an opportunity to visit this issue again. I guess I am the only one trying something like this. Since this problem is only an issue when the interface goes into profile mode on the device it must have something to do with how Lectora see's the "anchor' point of the objects in relationship to the the stage of the device. But I got no clue how to fix it... QUICKLY! I speculate the only way is going to be to reprogram the placement of objects for each interface position. Which frankly ..... well anyway if anybody has any advice here I would appreciate it. I have this particular interaction executed in a much more sophisticated manner on a job I am working on and it works fine in computer or tablet "landscape" mode but totally falls apart on devices when in profile position. Completely reprogramming for 3 out of the 5 Responsive title option inhibits my creative decisions when designing an interface. I don't know about you guy's but I don't have that kind of time, so I am left to have to dumb down the interface to something that is not competitive with other interactive interfaces out there on the web. Bummer!

Yeah I don't know what that DPI screen is all about like I said earlier everything is set correctly.

Additional problem I ran into was I made changes in the phone "landscape" mode to correct for the misalignment, manually changing everything only to discover it changed my computer alignment as well! Boogering up my computer and tablet responsive designs that were working fine. I thought if you made changes to the most outward levels in the responsive design interface (In this case the cell phone layouts) it DID NOT EFFECT the tablet or computer designs?

I appreciate your input on testing mods on the devices and I will give it a try but that is just no way to design you know? Constantly going back and forth to see if things are aligning properly. That's like saying you have to print an ad you want to put in a magazine before you know if it will look correct or rendering an animation before you can see if the movements are correct. Honestly that's decades old workflow. With technology today I see an animation play and the changes I make to it instantly without playback missing a beat.

Look I come from a video production background so I am use to using some very advanced software but at the end of the day I can't believe Lectora can't give me an intuitive design interface. I just cain't believe the programmers wouldn't have figured on this type of a problem.

Unfortunately Trivantis does not use standard CSS and media queries for RCD (why is beyond me?). Add to this that they re-size graphics and you have the mess you find yourself in. I tried to work at 300% using grids to align the buttons with the background image but the change in screen size changes the graphic sizes which re-aligns everything (I think that was what you were originally getting at I'm sorry I misunderstood.) and the slide values need to change. Aggravating. Personally, unless you really need this exact user interface you'd be better off choosing something that the current version of Lectora can handle a little easier. Another alternative might be to script it yourself. Hopefully Sergey or Tim sees this; they both have the ability to figure this one out.

It's not just your display, although it was looking odd.

The rest of the screen captures.

Also, the only real way to see how a lesson will look on a mobile device is on the mobile device. I suggest you set up a local server, like Wamp, and test on the actual device(s) you are targeting.

DRS

undefined

Capture4.pngCapture5.png

Here is a message I get when opening your .awt.

undefined

Capture6.png

Maybe you "stumped" everyone because there's nothing wrong with your file. Like Sergey said it's related to your display settings. See screenshots, everything is lined up fine.

Capture1.pngCapture2.pngCapture3.png

Agreed it's just the programming to be creative I am just not into.

Thanks I'll give your variable thing a try.

To be fair Lectora does some pretty amazing stuff. I build apps and websites and the things this program does for non-developers is nothing short of amazing. I wish it would do some of them in a more "traditional" way but I'm sure Trivantis has their logic about it. The reason why the program stands out from the others is because it easily allows you to extend its abilities by incorporating your own scripts and styling; with other programs it's very difficult if not impossible.

I think you are going to have to use the lecotra reserved variable "currentView" (no quotes) which returns the following values: Desktop, PhonePortrait, PhoneLandscape, TabletPortrait, TabletLandscape and use different slide values based on the type returned. Labor intensive.

Thanks for the honesty. I have been banging my head against this app for quite awhile. Thought maybe it was me that I was missing something. I am just accustom to applications that just get out of the way of the creative process. If I have to write code to do something I have to interrupt the creative process that's never a good thing. I have this same problem when I have to use power point. Not a fan of a process that limits me to think inside the box you know?

Discussions have been disabled for this post