React Three Fiber .glb model has blurry borders on rotate - reactjs

So I'm new to React Three Fiber and loaded a .glb file exported from blender into my React website using React Three Fiber. But, when the model is rotating and it hits the side of the plant and computer you can start seeing white, blurry lines on the borders of my objects. I have tried for multiple days to get rid of the this, but nothing seems to help. Something to note is that this doesn't seem to appear to happen in blender.
Links:
Example image of blurry borders on Plant and Computer
The public
website is www.mahitm.com.
The Github file for the model.
GLB Model download link
Thanks in advance to anyone that is able to help me! If any additional information is needed, I'm more than happy to provide you with it.

Related

How to step through a GIF animation based on the browser's scroll position?

I have a GIF that I will use in a React web app I am building. I want to be able to step through the animation based on the scroll position of the site.
I.e. when I have scrolled through 50% of the page, then I want the gif to display the image at its 50% position.
The gif will be in a div, position:fixed. So it will always live in the top corner of the browser.
The web app is a react app so if it's possible that there's a react library that implements this then that would be great.
Thanks!
There appears to be at least one ready made React implementation for dealing with the interaction with/playing of the GIF that may be able to assist you in your project.
React Gif Player is a React component which creates a GIF player similar to Facebook's implementation. It also comes with a pause function (and an example), which you may be able to use to programatically pause the GIF at corresponding points based on your scroll position.
Gif Frames is a pure JavaScript tool for extracting GIF frames and saving to file. You may be able to create individual frames and correspond frames with certain points of the scroll.
I'm not aware of a gif player that implements exactly what you were hoping for, although others may be able to assist in this regard. If not, you may have to use a combination of, or do a full implementation yourself.
Hopefully this helps.

.abc (Alembic) 3d model with animation won't play in SceneKit preview

I have been able to get models from .dae (COLLADA) files with animation working in the SceneKit preview (which is the best way I know to test if an animation is compatible).
I have a freelancer who made an animation for me originally in Cinema 4D, used a plugin to help with the animation, and exported it to me in .abc. He says he thinks the animations get lost when trying .dae format.
When I import his .abc file into Blender, it plays the animation perfectly, but importing into Xcode/SceneKit (whether I try to play it as a .abc file or after converting it to .scn) won't play the file. You can at best just see the initial positioning of the 3D model and no animation will play.

What's the Facebook/AirBnb app design effect called?

I want to read about that effect you see on pages like Facebook or Airbnb when you open the page and the browser shows you the low fidelity design of page while the actual data loads - so you'll see grey box instead in the place where pictures of the users will be, grey rectangles instead of the text content etc. I've been searching for hours but cannot find anything useful, anyone knows the name of this UX practice?
I believe this is referred to as loading dummy content. There wasn't much info when I searched for it, but I do know that the basic principle is first load a gray background for images and dummy block font then wait for your content to render.

Maya export issues into unity

I have modelled a character. It is textured, rigged, skinned and animated. The animation works fine in Maya (2014) but I have been running into lots of issues when I try to export it. When I export it into Unity or Blender, the mesh turns into a sphere. I have tried exporting it as fbx, ma and mb files. The animation is still there. I have no useless nodes in my outliner and have followed tutorials to ensure that I was choosing the right export options but to no avail. It's only happening to this particular model. Any help would be greatly appreciated.
A common mistake is to not have the right nodes selected, especially if selected from the viewport.
When you are selecting the mesh(s), make sure you select/export entire hierarchy.
Hope this helps.

Image popup wrapper/module for DNN

I'm using DNN 5 for a hobby site. I know asp.net development, but have never written a DNN module.
The site is basically a project log. I want content areas that combine text and image thumbnails in a page, like a set of instructions. When a user clicks a thumbnail, display a popup div containing a larger image modal like on a lot of sites these days. Basically I'm looking to wrap each image in functionality like provided by highslide JS, but I can't figure out the right way to implement highslide JS in DNN.
I'm not averse to buying a module that does this for me, but everything I've found is more gallery based. The main difference is I want to control individual images that are among/next to the text, not a set of of images for users to scroll through.
I figure this can't be too crazy an idea, someone must have done it before. Any tips on good approaches would be appreciated. I'm tempted just to go edit source, but that makes upgrading a pain...
Thanks!
If anyone else is looking for this functionality, there's a project on Codeplex which looks pretty good at least as a gallery for DNN. It implements the highslide type popups well.
http://wnslightbox.codeplex.com/documentation

Resources