If you want to tween a gui to a new position, you would use a line of code like the following:

gui:TweenPosition(UDim2.new(0,0,1,0), "Out", "Linear", 1, false)

What does all of this mean?

First of all, you will want to find the path to the gui element you would want to tween the position and/or size of. The path would be game.Players.LocalPlayer.PlayerGui.ScreenGui at least if used from a LocalScript.

TweenPosition is a method of a gui element that is either a Frame, TextLabel, TextButton, TextBox, ImageLabel or ImageButton.

TweenPosition will slide the gui to a new position which is set in the first part of the parenthesis, the part that says UDim2.new(). UDim2.new is used to define a two dimensional grid position or size on Roblox. If you look at the position property of a gui element, it will be put in the same order for UDim2.new().

TweenSize will make a gui grow/shrink to a new size and TweenSizeAndPosition will make a gui grow/shrink to a new size and slide to a new position. It is important to note that in TweenSizeAndPosition, size would be the first UDim2 and position would be the second.

• easingDirection

  EasingDirection indicates how the gui element will get to its new size or position. There are three settings, In, Out, and InOut. Personally, I always use "Out" as that is the example the wiki provides and it works.

• easingStyle

  EasingStyle tells the script how to make the gui move or change its size. There are 8 values for this but the only you will need to use are "Linear", which makes it move/change size with no special effects, "Bounce" will make it appear to bounce and "Elastic" will make it slowly stretch to the final position or size.

• Speed

  This determines how fast it will happen and is written in seconds.

• Override

  If you want the gui to be able to tween differently before it finishes its current tween, set the value to true. If you want the gui to tween to what it is supposed to without interruption, set it to false.

So let's say you have a gui and need to make it tween from anywhere on the screen off the bottom-right corner of the screen. You will do something like the following:

gui:TweenPosition(UDim2.new(1,0,1,0), "Out", "Linear", 1, false) -- this gui will move to position (1,0,1,0) smoothly in 1 second without interruption

If you want to change a gui's size to the size of the screen, you would do the following:

gui:TweenSize(UDim2.new(1,0,1,0), "Out", "Bounce", 4, true) -- this gui will grow to the size of the screen but will bounce back from the edges of the screen a little like a rubber ball. It will take it 4 seconds to complete this but it can be interrupted

If you need a gui to change its size and position to be a fourth the size of the screen and to be in the upper-right corner of the screen, you would do the following:

gui:TweenSizeAndPosition(UDim2.new(.5, 0, .5, 0), UDim2.new(0, .5, 0, 0), "Out", "Linear", .5, false) -- this would make the gui grow to be 25% of the screen's size, be in the upper right corner, transition there smoothly in half a second and without interruption

> TweenSize (
>     UDim2 endSize,
>     EasingDirection easingDirection = Out,
>     EasingStyle easingStyle = Quad,
>     float time = 1,
>     bool override = false,
>     void function() callback = nil )

• endSize
  • Sets the coordinates the GuiObject is meant to reach .. using the UDim2 data type
• EasingDirection
  • sets the direction the GuiObject is meant to translate from
• EasingStyle
  • simply determines how the GuiObject reaches its destination (..animation?)
• time
  • total amount of seconds the tween should take to reach its destination
• ovveride
  • set to false by default
  • when true, the GuiObject's trajectory can be reset or overridden by another tween request
• callback
  • can be used to specify a task that will be accomplished as soon as the tween is completed

EDIT TweenPosition and TweenSizeAndPosition work pretty much the same.

Tweening is a way to move gui's but this adds a little enistesics to your game. Each gui tween does different things. TweenPosition changes the position, TweenSize makes the gui grow/shrink, TweenSizeAndPosition does both.

TweenPosition

TweenPosition slides the gui over to it's next position:

gui:TweenPosition(endPos, EasingDirection, EasingStyle, Time, Override, callback)

• EndPos is the position you want the gui to go to.
• EasingDirection is "speed" the gui moves at, In means the gui moves fast at first and then slows
• down. Out is the opposite and InOut is both combined.
• EasingStyle is the style the gui will slide
• Time is how long it will take
• Override is if a Tween can be overrided
• callback, I honestly don't know what this is.

TweenSize

TweenSize grows/shrinks the gui

gui:TweenSize(endSize, EasingDirection, EasingStyle, Time, Override, callback)

• endSize is the Size the gui will end at

TweenSizeAndPosition

slides and grows/shrinks a gui.

gui:TweenSizeAndPosition(endSize, endPos, EasingDirection, EasingStyle, Time, Override, callback)

• Same as the above Tweens

Hope it helps!

Extras

There is a GUI de for tweening (get it?) Tween Guide

Tweening is when you move a part/gui smoothly from one position to another. It is mainly used like this for guis:

ObjName:Tween<Position/Size>(UDim2.new(x,x,y,y),moving speed,type,time,will stay centered)

For more references: http://wiki.roblox.com/index.php?title=Tweening Good luck :)