ADOBE AFTER EFFECTS: Forum Expressions Tutorials Creative Cloud

Animating a realistic text cursor

COW Forums : Adobe After Effects

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Perry Kroll
Animating a realistic text cursor
on Mar 25, 2013 at 5:33:53 pm

Hi all!

Does anyone have an idea for an easy way to animate a totally realistic text cursor? I have a project coming up with tons of 100% realistic Mac OS X and iOS UI simulation that needs to be done, and animating text cursors by hand is a huge pain. I'm looking for a solution that will advance the cursor as I animate text on character by character, blink the cursor in the precise cycle of fades and timing that I specify, and (most important) allow for the cursor graphic to be whatever I want.

Red Giant Text Anarchy is a great start, but unless I am missing something their cursor types are limited to pretty unrealistic cursors ( pipe | character, box, etc.) with no option for a cursor symbol of the exact size and color that I need.

I can easily handle the blinking automatically with expressions. The difficult part is making whatever graphic I use for the cursor jump to the right place as text is being animated on.


Return to posts index

Joseph W. Bourke
Re: Animating a realistic text cursor
on Mar 25, 2013 at 5:46:16 pm

To get 100 percent realistic - you should use the actual GUI, and record the screens with something like Camtasia:

http://www.techsmith.com/camtasia-mac-features.html

Joe Bourke
Owner/Creative Director
Bourke Media
http://www.bourkemedia.com


Return to posts index

Perry Kroll
Re: Animating a realistic text cursor
on Mar 25, 2013 at 5:47:59 pm

I certainly will be doing that for some of it, and I appreciate the software recommendation. I'll check that out! Thanks!

But the problem is, some of this stuff will just require too much tinkering and variability later so that's why I'm also looking into building an AE based simulation. I want to make sure I have options.


Return to posts index


Joseph W. Bourke
Re: Animating a realistic text cursor
on Mar 25, 2013 at 6:15:33 pm

I would think that some high rez screen captures (stills) of your interface, combined with the text animated cursor (I would swear that one of Red Giant's plugins has a perfectly accurate text entry simulator) - yup - it's Text Anarchy, and it appears to have just what you need:

http://www.redgiantsoftware.com/products/all/text-anarchy/features/#tabs

I own it, and just checked it out in AE - I created a line of text, with a blinking underline cursor, and the speed, color, font, cursor type (I used Underline, which is the standard in PC typing - I don't have a Mac, but I would imagine that the standard is the same). Looks to be the ticket, for 99 bucks.

Joe Bourke
Owner/Creative Director
Bourke Media
http://www.bourkemedia.com


Return to posts index

Perry Kroll
Re: Animating a realistic text cursor
on Mar 25, 2013 at 6:20:30 pm

Yeah, unfortunately as I mentioned in my first post above Text Anarchy doesn't do the job. Unless I am missing something it doesn't allow for full control of the look of the cursor. For example, the | character it lets you use is is the wrong height and has the wrong vertical spacing to look like a real cursor, and on iOS the cursor is a bit thicker, etc. I'm not sure that any modern UI uses an underline...


Return to posts index

Joseph W. Bourke
Re: Animating a realistic text cursor
on Mar 25, 2013 at 6:54:07 pm

Yeah...you're not going to run into that kind of custom control short of using Expressions, as far I know. Why does it have to be exact? Will anyone but you notice that difference? Who is the viewer of the final production?

Just a thought - what is the OS font used on the Mac - maybe by just changing the typeface (which you can do in Text Anarchy) to the system font, you could achieve the real look. Of course, the "real" look on any screen is going to be dependent on what the user has set up - I assume the Mac interface can be customized to use whatever typeface you choose, so it may well be that is no "actual" Mac look when typing, other than the default one.

Joe Bourke
Owner/Creative Director
Bourke Media
http://www.bourkemedia.com


Return to posts index


Perry Kroll
Re: Animating a realistic text cursor
on Mar 25, 2013 at 7:16:19 pm

Good call on changing the font to the Mac UI font (Lucida Grande). That does get me closer. Still not a 100% match, but it's progress.

I'd still be way off on the iOS cursor which is really thick.

It doesn't need to be 100% accurate, but the closer we can get the better. I can't say too much about the project. It's a feature film with a LOT of UI that's supposed to look like real-life found footage recordings and stuff. I also find myself doing iOS simulations all the time for iOS app ads or pitch videos, and I usually just animate that cursor by hand, so this would have applications in those projects as well if I can crack it.


Return to posts index

Joseph W. Bourke
Re: Animating a realistic text cursor
on Mar 25, 2013 at 7:54:16 pm

I would think that in a feature, because of the distance the viewer is away from the screen, close enough just might be close enough, unless you're doing ECUs, and you have a theater full of Mac afficianados...if you're doing this for The Steve Jobs Story it might be an issue...

Joe Bourke
Owner/Creative Director
Bourke Media
http://www.bourkemedia.com


Return to posts index


Roland R. Kahlenberg
Re: Animating a realistic text cursor
on Mar 25, 2013 at 7:59:28 pm

Use AE's Word Processor Text Animation Preset to create the basic cursor effect. Then add the following Text Animator properties - * Anchor Point (to shift the cursor in x/y co-ordinates)
* Scale
* Fill Color

to the Animator Group that has been selected as per the image. If it's not obvious, please note that the box that you see is the cursor. You will have limitless ways to control the look using this method.



HTH
RoRK

Intensive mocha & AE Training in Singapore and Other Dangerous Locations

Imagineer Systems (mocha) Certified Instructor
& Adobe After Effects ACE/ACI (version 7)


Return to posts index


Perry Kroll
Re: Animating a realistic text cursor
on Mar 25, 2013 at 8:28:59 pm

Roland - this is genius!

I knew about the Word Processor preset but I would never have thought of scaling the underscore character. I can even colorize it. This is a brilliant hack. Thank you!


Return to posts index

Roland R. Kahlenberg
Re: Animating a realistic text cursor
on Mar 26, 2013 at 12:56:33 am

I'm glad it's worked out well for you Perry.

Cheers
RoRK

Intensive mocha & AE Training in Singapore and Other Dangerous Locations

Imagineer Systems (mocha) Certified Instructor
& Adobe After Effects ACE/ACI (version 7)


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2017 CreativeCOW.net All Rights Reserved
[TOP]