Discussions

Ask a Question
Back to All

Video Generation (Create Avatar Video (V2)) of API v4.0.8 does not support fully-portrait video output.

Hi,

We are developing a tool to help speed up our video generation. We are using the HeyGen API and it has been very easy to set everything up - well done! There is one problem we are facing, though, and we could use some help on it:

  • Our flow is: upload audio resource -> generate 4 videos based on the same audio track (2 are using a landscape avatar, and 2 - portrait; all are 4k res).
  • The issue: the portrait video always gets rendered as a landscape video with added black lines to the sides.

Here is the body of the request we send for the portrait generations:

export const createAvatars = (): Avatar[] => {
  return [
    {
      id: AVATAR_PORTRAIT_1_ID,
      width: 2160,
      height: 3840,
      name: 'portrait_1'
    },
    {
      id: AVATAR_PORTRAIT_2_ID,
      width: 3840,
      height: 2160,
      name: 'portrait_2'
    },
    {
      id: AVATAR_LANDSCAPE_1_ID,
      width: 3840,
      height: 2160,
      name: 'landscape_1'
    },
    {
      id: AVATAR_LANDSCAPE_2_ID,
      width: 3840,
      height: 2160,
      name: 'landscape_2'
    }
  ];
};
export const createAvatarVideo = async (
  avatarId: string,
  title: string,
  audioId: string,
  width: number,
  height: number,
  apiKey: string
) => {
  const url = 'https://api.heygen.com/v2/video/generate';
  const options = {
    method: 'POST',
    headers: {
      accept: 'application/json',
      'content-type': 'application/json',
      'x-api-key': apiKey
    },
    body: JSON.stringify({
      caption: false,
      title,
      dimension: { width, height },
      video_inputs: [
        {
          character: {
            type: 'avatar',
            avatar_id: avatarId
          },
          voice: {
            type: 'audio',
            audio_asset_id: audioId
          },
          background: { value: '#f6f6fc', type: 'color' }
        }
      ]
    })
  };

  try {
    await fetch(url, options);
  } catch (error) {
    console.error('Error:', error);
  }
};
// avatars = createAvatars()
await Promise.all(
  avatars.map((avatar) => {
    return createAvatarVideo(
      avatar.id,
      `${getLatestIndex(videos)}-${path.parse(file.name).name}-${avatar.name
      }`,
      audioId,
      avatar.width,
      avatar.height,
      apiKey
    );
  })
);

Here is an example video generation:

Portrait Video 1 (Dimensions: width = 2160, height = 3840):

Portrait Video 1 URL

Portrait Video 2 (Dimensions: width = 3840, height = 2160):

Portrait Video 2 URL
Is there something we can do to get the portrait video in the specified resolution without any added background?

Thanks in advance,
team nibnab