It's quite easy to change the way a Bootstrap modal appears. The basic premise is to replace the .modal.fade and .modal.fade.in classes. You can use any number of transformations and transitions. For this example I'm growing and fading the modal in from below. This is all the CSS you need to modify your vanilla Bootstrap modals.

.modal.fade .modal-dialog {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    transform: scale(0.1);
    top: 300px;
    opacity: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.modal.fade.in .modal-dialog {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transform: translate3d(0, -300px, 0);
    transform: translate3d(0, -300px, 0);
    opacity: 1;
}

Feel free to play with the different transformations to get the effect you're looking for.

Demo

See the Pen ogbqjV by Scott Aikin (@Hawkee) on CodePen.