Nikolina Stanić Loknar

Dr. Nikolina Stanić Loknar

orcid

Research Focus & Metrics

Academic Career Length

7Years (2020-Present)

(Calculated once Scilit publication data is synced: current year − year of first publication + 1)

Representative Publications

View All Publications
3 November 2022
Verified
Conference Paper
Closed access
AAAna Agić
Ana Agić
LMLidija Mandic
Lidija Mandic
NLNikolina Stanić Loknar
Nikolina Stanić Loknar
Text legibility is an important and influential aspect of multimedia, not only on usual multimedia reading devices (displays, tablets, and mobile phones) but also in three-dimensional virtual environments (VE). In VEs, text can be used for many purposes in accordance with the category of experience (gaming, architectural visualization, exhibition, education). Font type used can deteriorate the VE experience if the user has to strain his eyes so that he may correctly read what has been written. The purpose of this research is to examine different fonts in order to determine which properties of a typeface are more suitable for VE. Four different fonts have been tested in 10 font sizes at three viewing distances (5, 10, and 15 meters). Times New Roman as a representative of serif fonts, Helvetica as a non-serif font, Caveat as a representative of handwritten fonts, and Roboto as a font for digital use, initially developed for the Android operating system. Different typographic characteristics of fonts significantly affect readability in VE. Additionally, was explored how the color of the text and the background color influence text readability in 20 combinations. It is known that the relationship between text color and background color affects readability. Since VR is a relatively new medium, we wanted to determine which relationship between colors of text and background is the best and whether it follows some rules present on the web. The colors of the text were black and white, and the colors of the background were black, white and gray, red, green, pastel green, blue, pastel blue, yellow, pastel orange, and pastel pink. Results regarding text color/background color have shown that most participants preferred black text on white background, black text on a gray background, and white text on a pastel orange background. On the contrary, participants rated white text on a yellow background as the least preferable combination, accompanied by white text on a pastel green background.

12 November 2020
Verified
Conference Paper
Closed access
NLNikolina Stanić Loknar
Nikolina Stanić Loknar
DBDiana Bratić
Diana Bratić
AAAna Agić
Ana Agić
Kinetic typography - text in motion is an animation method of characters that has a video form instead of some "static" form such as picture, poster or book. The most important element for figuration of kinetic typography is the choice of font. Furthermore, one should think about the letter cut, the size and color of the characters, and the background color on which the animation takes place. It can be created in various ways, most often using software that applies a multitude of effects to the text or letter character, creating dynamic solutions. The effects vary from the simplest such as "fade-in" and "fade-out" (entering and exiting text in and out of the frame). Static characters can expand, narrow, move slowly or rapidly, grow and change in a variety of ways to very complex ones in which the author builds an entire story or promotional video by carefully combining software capabilities. However, each software has its limitations and for this reason the kinetic typography presented in this paper is programmed using codes. In a wide range of available programming languages due to the simple interface that does not require advanced programming concepts and gives exceptional results in the field of kinetic typography, Processing was chosen. The Processing programming language is intended for generating and modifying graphics and is based on the Java programming language. The most important difference between Processing and Java is that Processing offers a simple programming interface that does not require advanced levels of programming such as classes, objects, or animations. It also allows advanced users to use them. Processing uses a variety of typography rendering approaches such as raster and vector solutions and allows typography to be programmed and displayed on the Web independently of the user's Web browser and font database. Processing enables the use of visual elements in animation, including typographic ones, by introducing interaction to the user. The user is no longer a passive observer but actively participates in the performance of the application whose final appearance is not predefined but arises from the actions of each individual user. For the purposes of this paper, individual letters were created in a font-making program. The letters made are of various written classifications and cuts, which with their variety contribute to the attractiveness of the animation. In the creating of motion typography in this paper, the programming language Processing was used. Written program codes that manipulate words, letters, or parts of characters to create interesting visual effects for the viewer that aim to hold the viewer's attention and convey the desired message or emotion. There are no strict rules and patterns when making kinetic typography. In kinetic typography, each author determines his own rules, method of production, and there are no same solutions.

12 October 2023 in Tehnički glasnik
Verified
Journal Article
Open access
PDF file
NLNikolina Stanić Loknar
Nikolina Stanić Loknar
TITajana Koren Ivančević
Tajana Koren Ivančević
MBMateo Bekavac
Mateo Bekavac
SVSnježana Ivančić Valenko
Snježana Ivančić Valenko
The development of web technologies has led to the availability of various multimedia content on the web. In addition to text, images, and videos, transitions, animations and interactivity are increasingly used. Transitions and animations present the...

23 May 2023 in Journal of Imaging
Verified
Journal Article
Open access
PDF file
TITajana Koren Ivančević
Tajana Koren Ivančević
NLNikolina Stanić Loknar
Nikolina Stanić Loknar
MRMaja Rudolf
Maja Rudolf
DBDiana Bratić
Diana Bratić
This paper proposes a method for changing pixel shape by converting a CMYK raster image (pixel) to an HSB vector image, replacing the square cells of the CMYK pixels with different vector shapes. The replacement of a pixel by the selected vector shape is done depending on the detected color values for each pixel. The CMYK values are first converted to the corresponding RGB values and then to the HSB system, and the vector shape is selected based on the obtained hue values. The vector shape is drawn in the defined space, according to the row and column matrix of the pixels of the original CMYK image. Twenty-one vector shapes are introduced to replace the pixels depending on the hue. The pixels of each hue are replaced by a different shape. The application of this conversion has its greatest value in the creation of security graphics for printed documents and the individualization of digital artwork by creating structured patterns based on the hue.

1 November 2024
Verified
Conference Paper
Closed access
ACAna Agić Cmrk
Ana Agić Cmrk
NLNikolina Stanić Loknar
Nikolina Stanić Loknar
LMLidija Mandic
Lidija Mandic
In this paper, several generative art methods for image creation are discussed. Generative art is a form of image and video creation using artificial intelligence and machine learning. The methods explored include Generative Adversarial Networks (GANs), Variational Autoencoders (VAEs), and Denoising Diffusion Probabilistic Models (DDPMs). GANs involve two submodels: a generator, which generates image examples, and a discriminator, which classifies whether the generated examples are real or fake. VAEs consist of an encoder, which compresses input data into latent variables, a latent space representing the compressed data, and a decoder, which reconstructs the original data from the latent samples. Diffusion models generate image data by gradually adding noise to the data (diffusion) and then reversing the process (denoising) to produce new data. This paper also discusses the challenges, applications, ethical considerations, and future directions of generative art in the field of graphic design.

15 January 2026 in Journal of Imaging
Verified
Journal Article
Open access
PDF file
TITajana Koren Ivančević
Tajana Koren Ivančević
TJTrpimir Jeronim Ježić
Trpimir Jeronim Ježić
NLNikolina Stanić Loknar
Nikolina Stanić Loknar
Although modern web technologies increasingly rely on high-performance rendering methods to support rich visual content across a range of devices and operating systems, the field remains significantly under-researched. The performance of animated visual elements is affected by numerous factors, including browsers, operating systems, GPU acceleration, scripting load, and device limitations. This study systematically evaluates animation performance across multiple platforms using a unified set of circle-based animations implemented with eight web-compatible technologies, including HTML, CSS, SVG, JavaScript, Canvas, and WebGL. Animations were evaluated under controlled feature combinations involving random motion, distance, colour variation, blending, and transformations, with object counts ranging from 10 to 10,000. Measurements were conducted on desktop operating systems (Windows, macOS, Linux) and mobile platforms (iOS, Android), using CPU utilisation, GPU memory usage, and frame rate (FPS) as key metrics. Results show that DOM-based approaches maintain stable performance at 100 animated objects but exhibit notable degradation by 500 objects. Canvas-based rendering extends usability to higher object counts, while WebGL demonstrates the most stable performance at large scales (5000–10,000 objects). These findings provide concrete guidance for selecting appropriate animation technologies based on scene complexity and target platform.